$msgBox配合$createElement产生的双向绑定问题
最后更新于
这有帮助吗？
最后更新于
这有帮助吗？
大家注意看这个滑块啊
正常这么滑动没问题
但是我一松手
他总是回去
原因是啊他这块用的是this.$msgbox
然后呢
中间用this.$createElement创建的这个虚拟节点
导致呢
他这块绑定的值没办法实现双向绑定
然后呢网上有这样的方法
就是在这写一个 ON
然后呢里边写input事件
然后呢我们手动的在这指定myVal等于value
我们来试一下啊
大家看这样滑动没问题
下边这个值是可以绑定可以设置上
但是我一松手
他还是有问题就说这个问题
没有彻底解决
后来我就想既然
他不能实现这种双向绑定
那我能不能就手动的在这去设置
（那个value）
所以呢我们就在这需要找到这个
我们可以用这个content看这个content
是这个
创建的虚拟节点，因为他是虚拟节点嘛
我们可以通过这种方式找到他的这个
组件的实例，然后直接修改他的value
等于value，我们来试一下
打开这样就可以了
但是呢我们打开控制台会发现
他总是会报一个警告打开
意思是我们手动修改了这个value啊
有可能
他没有修改他那个双向绑定的（原始变量的 ）数值
他会有问题
但是呢我们自己知道他
其实我们自己已经
修改了这个双向绑定值所以呢
这块呢
我们就要想办法把这个警告啊去掉
怎么去呢后来我想了个办法
就可以在这哈我们用这个
Vue.config.silent
我们首先把原来的这个配置备份一下
就是说他原来
可能默认就是
静默模式（true）
所以呢我们先把备份一下然后呢把它
设置成true
然后呢在下边再给它改回来
改成这个默认的值
好我们再来试一下
大家看既不报错也没问题了
这个值也对了
然后呢基于这个呢
我又封装了一个公用的方法
（我把这个注释掉）
这
是调用哈
这个代码呢都在这个文件里边
引进来之后呢
直接掉这个方法把this传进去
然后呢配置一下slider
然后呢我们有两种模式
第一种就是这样
我们在beforeClose里面
去模拟一个网络请求
大家看一下
大家看现在这个值
后面的是没变的
只有我确定的时候
他会模拟一个网络请求
成功之后才会赋过去
然后第二种模式呢
就是我们不用这个beforeClose
我们可以直接写一个onInput
然后呢在这直接每次
相当于滑动的时候就会把这个值变化
我们再来看一下
打开这样就没问题了
然后呢这个代码呢还是我放在这里了
大家如果需要的话呢可以过来找一下