Ember - 组件属性未在模板 hbs 中更新

Question

我的 component.js 中有一个组件属性，基于该属性我将在 template.hbs

中显示/隐藏一些数据

案例1： 默认情况下，componentProperty (canShow) 为 true，但根据数据的一些变化，它会在另一个 computed property 中设置为 false。

        dataChanged: computed( 'data', 'canShow', function () {
             let someCalc = doSomeCalc;
             if(someCalc !== 0) { 
                this.set('canShow', false);
             }
            return someCalc;
        });

预期：Canshow 应该是假的，所以模板中的数据应该被隐藏 结果：它被更新为假，但在模板中数据仍在显示

案例2： 我已经在计算中使用 getter 和 setter 进行了尝试。

    canShowTemplateData: computed('canShow', {
       get() {
          return this.get('canShow');
        },
        set(key, value) {
          return value;
        }
    });

即使在这种情况下，set 也能正常工作。但是使用 get() 函数在模板中根本没有更新该值。另外请在使用 set() 时澄清一下，哪个值应该更新canShow 或canShowTemplateData？

我错过了什么吗？或者有没有其他方法可以解决这个问题？

Answer 1

首先，计算属性不应该有副作用。所以永远不要在计算属性中调用this.set，或者做类似this.foo = ...的事情。

您的第一个计算属性也有问题：它从不返回任何内容。

您使用 setter 的第二个示例没有意义。你的 setter 并没有真正做任何事情。

你想要的大概是这样的：

    canShow: computed( 'data', function () {
        if(it is true) { 
            return false;
        } else {
            return true;
        }
    });