Nuxt:显示静态文件夹中的本地图像

JavaScript Vue.js

乐米亚

2020-03-26

在此处输入图片说明

我正在开始使用nuxt。我的静态文件夹在屏幕截图中。我一直在尝试遵循https://nuxtjs.org/guide/assets/#static

我有一个vuetify轮播组件,可以将url作为src正常工作。现在,我想尝试提供本地静态文件。我试过了:

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


    <script>

export default {
  data () {
    return {
      items: [
        {
          src: '/static/52lv.PNG'
        },
        {
          src: 'https://cdn.vuetifyjs.com/images/carousel/sky.jpg'
        },
        {
          src: 'https://cdn.vuetifyjs.com/images/carousel/bird.jpg'
        },
        {
          src: 'https://cdn.vuetifyjs.com/images/carousel/planet.jpg'
        }
      ]
    }
  }
}
</script>

但是现在当我运行开发服务器时,我看到了那个轮播图像的黑屏。其他带有网址的图片也可以正常工作。

检查浏览器中的空白元素,我看到:

在此处输入图片说明

如何显示此图像?

第3752篇《Nuxt:显示静态文件夹中的本地图像》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

0个回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android