VUE発行プレビュー

最初：viewerjs使用プレゼンテーション（PC、携帯端末の互換性）

1、最初の依存関係をインストール

 NPM V-ビューア--saveをインストール 

main.js内2、参照及び登録呼出

//main.js 
「V-視聴者からの輸入ビューア
インポート'viewerjs / DIST / viewer.css' 

Vue.use（ビューア）。
Viewer.setDefaults（{ 
  オプション：{ "インライン"：真、 "ボタン"：真、 "ナビゲーションバー"：真、 "タイトル"：真、 "ツールバー"：真、 "ツールチップ"：真、 "可動"：真、 "ズーム可能な"：真、 "回転可能"：真、 "スケーラブル"：真、 "遷移"：真、 "フルスクリーン"：真、 "キーボード"：真、 "URL"： "データソース"} 
）}。

図3に示すように、コード使用xxx.vue

< テンプレート> 
    < divのクラス= "コンテンツ" > 
        < ビューア：画像= "IMGS" > 
            < IMG V-用= "IMGSでSRC" ：SRC = "src.url" ：キー= "src.title" > 
        </ ビューア> 
   </ DIV > 
</ テンプレート> 
< スクリプト> 
輸出デフォルト{ 
  データ（）{ 
    リターン{ 
      IMGS：[ 
       { 
          URL：" ../ ../static/image/aze.jpg "、
            タイトル：' チャップマン' 
        }、
        { 
          URL：' https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3564877025,796183547&fm=27&gp=0.jpg ' 、
          タイトル：' 写真2 ' 
        } 
      ] 
    } 
  } 、
} 
</ スクリプト>

このブロガーと上記V-ビューアはもちろん、しようとする我々はできる他のプラグインがあり、非常に良いです

適した移動端末画像プレビュープラグVUE-フォトプレビュー

vue2-プレビュー：https://www.jianshu.com/p/37ff607ad2b4

参考ます。https：//www.jianshu.com/p/e3350aa1b0d0