触发computed 或者watch

...... computed:{ getinfo:{ get:function(){ return 'init'; }, set:function(newValue){ console.log(newValue); } } } //通过js控制input标签值,发现不能触发computed的set函数,因为个人开发环境问题,须用js赋值input这种方式,需要有人指点一二 document.getElmentById('demo').value='demo'; .....

因为对 HTMLInputElement.value 的写入动作不触发事件,Vue 自然也就无法响应。如果状态变化的起点必须是 <input>(而不能是某个 JS 对象),你可以手动构造一个 input 事件并触发,这样 Vue 就能响应了。

不是有 input、change事件吗?而且还可以v-model双向绑定。为什么说HTMLInputElement.value的写入动作不触发事件呢?

楼主和大神的帖子有点看不懂 :sob:

<input id="ipt" onchange="alert('onchange')">

<script>
  document.getElementById('ipt').value = 'whatever'
</script>

这样并不会有 input 或 change 事件被触发(即使 input 的值确实被修改了),Vue 的双向绑定也不会工作(因为 Vue 的 v-model 实际上是依赖事件的)。

好吧,那看来楼主并用Vue的双向绑定的话,应该是很容易解决的问题。

如果要用vue以外的js代码对value进行写入的话,应该可以通过vm去修改Vue示例里面绑定的值了。

我说的对吧? :joy:

看你把「状态源头」放在哪里。如果放在 <input>(任意时间以 DOM 节点的属性值为最终业务依据),那就构造事件;如果放在 Vue 实例(任意时间以 JS 对象的属性值为最终业务依据),那就修改 vm 状态。

1 Like

还是大神想得周到,要是我去你那里面试,我就是不及格 :sweat_smile: