vant 中使用cell组件 定义图标该图片和位置像微信信息栏一样
二级经营单位
//css样式,给cell部分从新定义了css样式
.van-cell__value {
color: #e6210c;
font-weight: bold;
font-size: 1rem;
overflow: hidden;
text-align: right;
line-height: 3.0625rem;
flex: 1;
position: relative;
vertical-align: middle;
}
.van-cell__title{
position: relative;
flex: 2;
}
.c1{
width: 0.625rem;
height: 0.625rem;
}
.van-cell__label[data-v-5ff568b8] {
font-size: 1rem;
line-height: 1.1rem;
padding-left: 4.3rem;
}.custom-text{
font-size: 1.2rem;
margin-left: 4.3rem;
}主要百度上的方法都试过了,实在没有办法。
补充知识:vant Grid组件图片加载问题 无法加载本地图片解决方案
我们引入图片直接用官网给的icon来加载案图片

{{item}}
然后我们图片地址得用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')
},
]