需求:页面的tabs选项通过后台获取,活动标签的label是文字,传给后台需要数字,不要字符串,但是el-tab-pane的 :name只接收string不接受int型,只要绑定就报错
报错如下:
image.png
解决方法:
1.在调用后台接口获取到的数据去遍历转成字符串
2.让后端人员改变返回的类型,但是我们后端有点懒,半天没给我改,我就自己动手了
<el-tabs @tab-click="handleClick" v-model="quoteWay" type="border-card" >
<el-tab-pane v-for="item in wayList" :key="item.way" :label="item.wayName" :name="item.way">
</el-tab-pane>
</el-tabs>
export default {
created(){
this.getWay()
},
methods: {
getWay(){
getWay().then(res=>{
if(res.data.code == 200){
this.wayList = res.data.data
this.wayList.map(item=>{
// el-tab-pane的name只接受string类型不接受int型
item.way = item.way.toString()
}
}
})
}
}
}
网友评论