我需要將 {{item.icon}} 拉為 html 資料而不是字串,但我不知道該怎么做,有沒有辦法做到這一點,請幫幫我
我有這個代碼:
<div v-for="(item, index) in items" :key="index" >
<div >
<router-link to="/ninethPage">
<div style="padding: 1rem 2rem !important">
<span v-html="icon"> </span>
<p>{{item.title}}</p>
</div>
</router-link>
<router-view></router-view>
</div>
</div>
</div>
export default {
el: '#app',
data() {
return {
items: [
{title: 'Android', icon: <i style="font-size: 1.5rem;" ></i>},
{title: 'IOS', icon: <i style="font-size: 1.5rem;" ></i>}
]
}
},
components:{
Header
}
}
`
uj5u.com熱心網友回復:
icon: <i class=...是創建元素的 JSX 語法,需要與渲染函式一起使用而不是模板。它應該是一個字串,icon: '<i class=...'.
沒有icon財產,應該有<span v-html="item.icon">。
指定整個圖示元素是不切實際的。如果只有<i>類不同,它可以是icon: 'fa-android',并且可以用于:
<i fab mx-3 img-fluid" style="font-size: 1.5rem" :/>
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/378496.html
