vue动态参数绑定异常 处理纪要(双向绑定异常)

背景:公司前端项目采用vue架构,期间遇到动态参数绑定时参数不能实时绑定的问题,特此纪要!
问题:vue动态参数绑定异常(双向绑定异常)如何处理?
说明:动态参数绑定异常指的是排除正常的语法错误的前提下发生的异常。
场景:在处理一个动态渲染的下拉框来联动触发其他dom的过程中发现参数不能够实时绑定。
解决:
    1. vue有一个类似于jquery控件赋值的函数$set(),用他来进行封装赋值。
    2. 基于上一步vue还有一个类似于事物提交赋值的函数$forceUpdate(),以动态绑定刚才实时获取赋值后的绑定参数。

    下面是项目上一个简单的Demo处理,以供参考!
/** 组件渲染更新处理 */
changeLlogisticsSource() {
    this.$set(this.carr, 'xxx1', false);
    this.$set(this.carr, 'xxx2', false);
    if (this.carr.logisticsSource == 10) {
        this.$set(this.carr, 'xxx1', true); //处理
    }
    if (this.carr.logisticsSource == 20) {
        this.$set(this.carr, 'xxx2', true);
    }
    this.$forceUpdate();
}
函数使用说明:
    //this.$set(this.carr, 'xxx1', false);
        1. this指代顶层父容器。
        2. $set(container, attribute, value);
            container:第一个参数指代的是你在设置处理的根容器。
            attribute:第二个参数指代的是容器内设置的属性名称。(类似于一个key)
            value:第三个参数指代的就是你要绑定的具体值。

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值