美文网首页Vue.js专区Element UI
vue+element el-select 选项无法选择的问

vue+element el-select 选项无法选择的问

作者: 风雨兼程620 | 来源:发表于2019-04-03 16:50 被阅读0次

    使用Vue框架和element-ui开发时,在el-select下拉框遇见的问题,改变了页面中的某个值,在函数中查看是修改成功了,但在页面中没有及时刷新改变后的值,也就是下拉框值无法选中。有人说写个change事件就好了,然而并没有什么卵用,但是change事件需要留着。

      话不多说,直接干货。

    产生问题代码

    出现这个问题就是绑定了对象(需求如此),render函数没有自动更新,数据刷新了,但是视图没有刷新,而this.$ste和this.$forceUpdate就是重新render。

    解决办法:

    1.通过this.$set()解决

    businessTypeChange(item){

            this.$set(this.form.customs.businessType)

            console.log(item);

          },

    注意,修改this.$set()的使用方法

    对this.$set()方法进行了多次尝试,发现存在bug

    正确的写法应该是:

    businessTypeChange(item){        this.$set(this.form.customs,'businessType',item)        console.log(item);      }, 

    向this.$set() 里传入3个参数, 第一个是包裹字段的父级对象, 第二个是目标字段, 第三个是将要赋值给目标字段的数据

    2.通过 this.$forceUpdate()解决

    businessTypeChange(item){

            this.$forceUpdate();

            console.log(item);

          },

    本人亲试,都有效果

    相关文章

      网友评论

        本文标题:vue+element el-select 选项无法选择的问

        本文链接:https://www.haomeiwen.com/subject/srombqtx.html