【问题标题】:Reactivity in vue js v-model when updating value via JS/some plugins通过 JS/某些插件更新值时 vue js v-model 中的反应性
【发布时间】:2018-03-09 18:13:25
【问题描述】:

我目前在理解 VueJS 的 v-model 反应性如何工作时遇到了一些麻烦。

我有一个选择插件可以帮助我设置选择字段的样式,但是它当然会通过 JS 更改选择字段的值,问题是它永远不会触发 v-model 来更新其值,如果我尝试 @ 也会发生同样的情况987654321@,如果我这样做,v-model 将不会更新,它只会在我直接在字段中输入或单击实际选择字段时更新。

正如我所读到的,Vue 似乎只监听 input 事件来触发其反应性,当我简单地用 JS 更改字段的值时,不会触发事件,尽管不会更新变量的价值。

我真的需要更深入地了解这一点,并在下次发生此类问题时找到处理此类问题的最佳方法。在我无法控制插件事件的情况下,最好的解决方案是什么?当值动态更改并且再也不会出现此问题时,如何让 Vue 监听?

感谢您的帮助!

【问题讨论】:

    标签: vue.js vuejs2 vue-component


    【解决方案1】:

    我不完全确定这是否会有所帮助,但您是否看过表单输入组件? https://vuejs.org/v2/guide/components.html#Form-Input-Components-using-Custom-Events

    您的输入组件必须将事件发送回外部,以使其更新与该组件关联的v-model 的值。

    如果您无法确定输入值是否已更改,您可能还需要检查 watchers https://vuejs.org/v2/guide/computed.html#Computed-vs-Watched-Property

    希望对你有所帮助。

    【讨论】:

    • 我认为这对我没有多大帮助。我没有输入组件,我正在使用一个 jQuery 插件来设置我的 select 字段的样式,我还使用另一个插件进行日期选择,该插件绑定到另一个输入并更改其值,两者都不更新值更改时的 v-model。我设法通过将.lazy 添加到v-model 来使日期选择器工作,但这似乎不适用于选择,而且看起来也不正确。有什么线索吗?
    • 哦,我明白了——所以这是jQueryVueJs 之间的一场战斗。检查 jQuery 插件是否调度了任何事件 - 您可以从 Vue 组件中监听这些事件,然后相应地更新值。
    • 我明白了,我想避免这种方法,因为它看起来太手动了,但我不知道是否还有其他出路。我会试试的,谢谢:)
    • 没问题 - 希望你能解决问题。
    猜你喜欢
    • 2020-03-29
    • 1970-01-01
    • 2022-07-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-11-07
    • 2020-05-05
    • 2021-05-26
    相关资源
    最近更新 更多