Vue.js中如何實作動態的:src?
P粉937769356
P粉937769356 2023-09-16 09:38:42
0
1
643

我希望使用v-bind:src動態渲染一個有v-for影像src的v-vor影像。儘管圖像目錄似乎是正確的(但我如何檢查呢?)並且其他數組鍵被顯示,但我在模板中看不到圖標。

structure:   src 
                - assets              // 图像内部 
                -components           // 组件内部    
                
<q-card v-for="benefit in benefits" :key="benefit.title">
        <img class="benefits__item-icon" :src="benefit.icon" :alt="benefit.alt">
        <q-card-section >
          <div>{{benefit.content}}</div>
        </q-card-section>
      </q-card>

data() {
      return {
        benefits: [
          {
            icon: '../assets/benefits-icon.svg',  //不显示
            alt: 'benefits',       //正常显示
            title: 'plain text',   //正常显示
            content: 'plain text'   //正常显示
          },
        ]
       }
     }

P粉937769356
P粉937769356

全部回覆(1)
P粉310754094

嘗試更改此程式碼

1. <img class="benefits__item-icon" :src="require(benefit.icon)"
    :alt="benefit.alt">
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板