我们引入图片直接用官网给的icon来加载案图片
<van-grid square>
<van-grid-item
v-for="(item,index) in gridtextlist"
:key="index"
:text="item.text"
:icon="item.photo"
/>
{{item}}
</van-grid>
然后我们图片地址得用require包一下
gridtextlist:[
{
text:"女性专区",
icon:"n",
photo:require('../assets/cyimages/images/1indexjg1_05.png')
},
{
text: "无醇",
icon:"w",
photo:require('../assets/cyimages/images/1indexjg2_05.png')
},
{
text:"聚会畅想",
icon:"j",
photo:require('../assets/cyimages/images/1indexjg3_05.png')
},
{
text:"关于爱情",
icon:"g",
photo:require('../assets/cyimages/images/1indexjg4_05.png')
},
{
text:"火锅绝配",
icon:"h",
photo:require('../assets/cyimages/images/1indexjg5_05.png')
},
{
text:"套餐推荐",
icon:"template",
photo:require('../assets/cyimages/images/1indexjg6_05.png')
},
{
text:"送礼服务",
icon:"scoped",
photo:require('../assets/cyimages/images/1indexjg7_05.png')
},
{
text:"侍酒专区",
icon:"sh",
photo:require('../assets/cyimages/images/1indexjg8_05.png')
},
]