鍍金池/ 問答/HTML/ vue-cli 圖片動態(tài)引入 怎么寫呢？圖片放在了assets 里面了。

vue-cli 圖片動態(tài)引入 怎么寫呢？圖片放在了assets 里面了。

<el-dialog :visible.sync="dialogVisibleImg"  title="查看商品詳情" class="prodectData" :show-close="true">
    <img :src="dialogImg"style="width: 100%">
    <div class="language">
      <video :src="dialogVideo" controls></video>
    </div>     
</el-dialog>
  methods: {
    show(item) {
      var dialogImg;
      var dialogVideo;
      switch (item.bookId) {
        case 1186:
          dialogImg = import("../../assets/mathematics.png");
          dialogVideo =import("../../assets/video/mathvideo.mp4");
          break;
        case 1185:
          dialogImg = import("../../assets/language.png");
          dialogVideo =import("../../assets/video/chinesevideo.mp4");
          break;
        case 1172:
          dialogImg = import("../../assets/english.png");
          dialogVideo = import("../../assets/english.png");
          break;
        default:
      }
      self.dialogImg = dialogImg;
      self.dialogVideo = dialogVideo;
      self.dialogVisibleImg = true
    }
  },

同事把圖片和視頻放在了assets 里面了。
這樣寫，沒有效果。。。怎么寫呢？

回答
編輯回答
傲嬌范

vue-cli里默認(rèn)是把純靜態(tài)資源放在static下的，參見dev-server.js里的這段代碼
var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
app.use(staticPath, express.static('./static'))

2018年4月30日 11:33
編輯回答
玩控

先 var img1 = import('......')
再在case 里
dialogImg = img1

2017年9月27日 01:47
編輯回答
呆萌傻

把圖片寫在dom里面，用你的show()控制v-show

2017年1月7日 13:18
編輯回答
青檸

這樣寫，用import from的寫法，代碼親測有效

<script>
import img1 from '../../assets/mathematics.png'
import img2 from '../../assets/language.png'
export default {
    methods: {
    show(item) {
      switch (item.bookId) {
        case 1186:
          dialogImg = img1;
          dialogVideo =img2;
          break;
        //省略代碼
      }
      //省略代碼
    }
  },
}
</script>
2018年3月8日 06:23