相关疑难解决方法(0)

使用Nuxt动态获取文件夹中的图像路径

在此输入图像描述

我正在使用带有vuetify的nuxt.我有一个工作轮播组件.我想生成静态文件夹中的.png文件列表.以下使用webpack从目录动态导入图像,然后按照https://webpack.js.org/guides/dependency-management/#context-module-api我的组件如下所示:

 <template>
  <v-carousel>
    <v-carousel-item v-for="(item,i) in items" :key="i" :src="item.src"></v-carousel-item>
  </v-carousel>
</template>


<script>

  var cache = {};
  function importAll(r) {
    r.keys().forEach(key => cache[key] = r(key));
  }
  var getImagePaths = importAll(require.context('../static/', false, /\.png$/));
  // At build-time cache will be populated with all required modules. 
  export default {
    data: function() {
      return {
        items: getImagePaths
      };
    }
  };
  //     export default {
  //       data() {
  //         return {
  //           items: [{
  //               src: "/52lv.PNG"
  //             },
  //             {
  // …
Run Code Online (Sandbox Code Playgroud)

javascript webpack vue.js nuxt.js nuxt

9
推荐指数
1
解决办法
2382
查看次数

标签 统计

javascript ×1

nuxt ×1

nuxt.js ×1

vue.js ×1

webpack ×1