最近做项目用到vue+iview Switch 开关,遇到两个问题
问题1:直接引用开关组件 组件在页面中显示不出来 如:<Switch v-model="switch1" @on-change="change" />
解决:<i-switch v-model="switch1" @on-change="change" />这样就可以了
问题2:从后台获取数据回显的时候报错 如:Value should be trueValue or falseValue
解决:
<template>
<i-switch v-model="data.switchShow" size="large" true-value="true" false-value="false">
<span slot="open">开启</span>
<span slot="close">禁用</span>
</i-switch>
</template>
<script>
export default {
data() {
return {
data: {
switchShow: false,
},
}
},
mounted() {
axs.get('').then(res => {
this.data= {//重新赋值switchShow属性 因为请求之后switchShow属性会被清空,,清空之后没有默认值,v-model是双向数据绑定 没有值所以会报错
switchShow: res.data
}
})
}
} </script>
注:如有纰漏请大家及时指出!嘿嘿
来源:oschina
链接:https://my.oschina.net/u/4388677/blog/3519600