javascript - 正在为未受影响的其他组件触发 Vue 指令

Question

我有一个指令:

Vue.directive('autosave', {
    componentUpdated(el) {
        console.log(el);
    },
})

我有 2 个元素(vuetify):

this is a wrapper around input
<v-text-field label="Field 1" v-model="model1" v-autosave></v-text-field>
<v-text-field label="Field 2" v-model="model2" v-autosave></v-text-field>

如果我对第一个输入进行更改，则两个输入的指令都会被调用。为什么是这样？如何才能只调用受影响的元素？

Vue版本:2.5.3
Vuetify 版本:1.0.0-beta.4

Answer 1

根据the docs :

componentUpdated: called after the containing component’s VNode andthe VNodes of its children have updated.

它被调用是因为包含组件的 VNode 已更新。您似乎期望它像 input 或 change 事件一样工作。你为什么不使用 v-on ？

你可能应该做的是输入 watch关于你的变量。