Ich bin neu bei vuejs. Der unten gezeigte Code, isBtnDigitizePolygonClicked
是一个响应式变量。我试图在isBtnDigitizePolygonClicked
的值发生变化时执行一些代码作为副作用。为此,我使用了watch
, der unten gezeigte Code.
Das Problem, das ich jetzt habe, ist, dass bei der Ausführung des Codes die Protokollmeldung in onDigitizePolygon
方法,但在被观察的变量isBtnDigitizePolygonClicked
trotz Aufruf nie angezeigt wird, als ob der Beobachter nicht ausgeführt würde.
Bitte sagen Sie mir, warum das passiert und wie ich es beheben kann.
Code:
let isBtnDigitizePolygonClicked = ref(true); ... ... watch: { isBtnDigitizePolygonClicked(newVal, oldVal) { console.log(debugTag, 'newVal:', newVal); console.log(debugTag, 'oldVal:', oldVal); if (digitizePolygonInteractions) { if (newVal == true) { digitizePolygonInteractions.remove(); } else { digitizePolygonInteractions.add(); } } else { throw new Error('WTF.digitizePolygonInteractions is:'); } }, immediate: false, }, computed: { compPropsIsBtnDigitizePolygonDisabled() { if (isBtnDigitizePolygonClicked.value == true) { return values.CONST_STRING_DIGITIZE; } else { return values.CONST_STRING_STOP_DIGITIZE; } }, }, methods: { onDigitizePolygon() { console.info(debugTag, 'onDigitizePolygon()'); isBtnDigitizePolygonClicked.value = !isBtnDigitizePolygonClicked.value; }, }
Vorlage:
<button @click="onDigitizePolygon()">{{ compPropsIsBtnDigitizePolygonDisabled }}</button>
使用 options-api,您可以直接编写:
data() {..}
中的内容会自动响应式。 因此,不需要使用我认为我的错误在于,我没有将
isBtnDigitizePolygonClicked
添加到`data()`的返回值中代码: