关于元素值更改的 Vuejs 事件？

Question

我有一个元素想要观察这样的变化：

<span id="slider-value-upper" class="lower">50</span>

是否可以用 vuejs 干净利落地做到这一点？我试着查看文档，但找不到类似的内容。

我想在 VueJs 将“50”更改为其他内容时启动自定义事件。

Answer 1

您尝试过 watch 吗？在你的情况下它会是这样的。

模板

<div id="app">
    {{ message }}
    <span id="slider-value-upper" class="lower">{{myValue}}</span><br />
    <input v-model="myValue">
</div>

js代码

new Vue({
    el: '#app',
    data: {
        message: 'Watch example',
        myValue: 50
    },
    watch: {
        'myValue': function(val, oldVal){
        if (val < 50) {
            this.message= 'value too low!';
        }else{
          this.message= 'value is ok';
        }
      }
    }
})

查看 the example

关于元素值更改的 Vuejs 事件？

Vuejs event on change of element value?

javascript

element

vue.js