0
我有一个很奇怪的问题。我有简单的服务和vue组件。在模板中,我有v-如果哪个监视服务变量(如果它是真的 - div应显示,否则不应该)。它在我定义具有指定布尔值的变量时起作用,但在变量未定义时不起作用。我的方法isOpened()将它评估为布尔值,所以我不明白为什么这个代码不能正常工作。也许下面的代码会解释这个问题更好:Strage Vue行为。 V-如果没有正确观察
<template>
<div id="communicate" v-if="service.isOpened()">
This should display if 'f' property in service is true
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
class OtherService {
private f:boolean = false; //works, div is displayed with this line uncommented
//private f:boolean; // f is undefined - does not work with this line uncommented
public info(foo:string) { this.f = true; }
public isOpened() { return (this.f === true) } //f is evaluated to bool anyway so it should not be any difference
}
export default {
name: 'component',
data: function() {
return {
service: new OtherService()
}
},
mounted: function() {
console.log(this.service.isOpened()) //prints always false - ok
setTimeout(() => {
this.service.info('setting f to true') // f is set to true
console.log(this.service.isOpened()) // prints true, div should display.
}, 2000)
}
};