Vueは携帯電話のカメラとアルバムを呼び出す機能を実装します

<div>
//表示する画像 <div class="imgBox name">
      <img :src="imgSrc" />
  </div>
  <バンアクションシート v-model="show1">
   <ul>
    <li class="paizhao" @click="captureImage()">写真を撮る</li>
    <li class="paizhao" @click="galleryImg()">アルバムから選択</li>
    <li class="paizhao" @click="quxiao()">キャンセル</li>
   </ul>
  </バンアクションシート> 
</div>

//data() で宣言された変数 {
戻る {
 imgSrc: "", // 表示される画像パス tupianlist: "", // 表示される画像コンテナ }
}

メソッド: {
     // アルバムから画像を選択する galleryImg() {
      これを = this とします。
      console.log("アルバムから写真を選択してください:");
      plus.gallery.pick(function(path) {
        This.imgSrc = path; //path はローカルパスです let img = new Image();
        img.src = パス;
        img.onload = 関数(パス) {
          var that = img;
          var w = that.width, //320
            h = その高さ、//426
            スケール = w / h;
          w = 320 || w;
          h = w / スケール;
          var キャンバス = document.createElement("キャンバス");
          canvas.width = 300; //この設定は失われません。失われると、キャンバスのデフォルト サイズ 300*150 になります。 canvas.height = 300; //この設定は失われません。失われると、キャンバスのデフォルト サイズ 300*150 になります。 var ctx = canvas.getContext("2d");
          ctx.drawImage(0, 0, 300, 300);
          var base64 = キャンバス.toDataURL(
            "画像/png",
            「画像/jpeg」、
            "画像/jpg",
            1 || 0.8
          );     
          this.tupianlist = base64; です。
          // console.log(This.tupianlist + "私はトランスコードされたベースです");
 
  //ここでインターフェースをリクエストできます};
      });
    },
    // 写真を撮る captureImage() {
      これを = this とします。
      var cmr = plus.camera.getCamera(); //カメラ管理オブジェクトを取得します。 var res = cmr.supportedImageResolutions[0]; //文字列配列、カメラがサポートする解像度 var fmt = cmr.supportedImageFormats[0]; //文字列配列、カメラがサポートするファイル形式 // console.log("写真解像度: " + res + "、写真ファイル形式: " + fmt);
      cmr.キャプチャ画像(
        関数(パス) {
          plus.gallery.save(パス、パラメータ => {
            ファイルに params.file を設定します。
            //base64としてエンコード
            var img = 新しい画像();
            img.src = ファイル;
            img.onload = 関数() {
              var that = img;
              var w = that.width,
                h = その高さ、
                スケール = w / h;
              w = 320 || w;
              h = w / スケール;
              var キャンバス = document.createElement("キャンバス");
              canvas.width = 300; //この設定は失われません。失われると、キャンバスのデフォルト サイズ 300*150 になります。 canvas.height = 300; //この設定は失われません。失われると、キャンバスのデフォルト サイズ 300*150 になります。 var ctx = canvas.getContext("2d");
              ctx.drawImage(0, 0, 300, 300);
              var base64 = キャンバス.toDataURL(
                "画像/png",
                「画像/jpeg」、
                "画像/jpg",
                1 || 0.8
              );
              // コンソールログ(base64);
              this.tupianlist = base64; です。
  //ここでインターフェースをリクエストできます};
          });
          //写真撮影操作を実行する// URLパラメータを介してディレクトリオブジェクトまたはファイルオブジェクトを取得する plus.io.resolveLocalFileSystemURL(path, function(entry) {
            var tmpPath = entry.toLocalURL(); // ディレクトリ パスを取得し、ローカル パスの URL アドレスに変換します。This.imgSrc = tmpPath;
            // alert("撮影成功: " + tmpPath);
          });
        },
        関数（エラー）{
          // イメージキャプチャが失敗したときのコールバック // alert("イメージキャプチャに失敗しました: " + error.message);
        },
        { 解像度: res、フォーマット: fmt }
      );
      this.show1 = false;
    },
}