vue+iview Switch 开关

最近做项目用到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>

注:如有纰漏请大家及时指出!嘿嘿

posted @ 2019-05-29 11:18  嘿嘿小蜗牛呐  阅读(9764)  评论(0编辑  收藏  举报