所以我在控制器中有一个这样的父进程
import Controller from '@ember/controller';
export default class IndexController extends Controller {
@service firebaseApp;
@service fastboot;
@tracked user =false;
async init(){
super.init(...arguments);
if (!this.fastboot.isFastBoot){
const auth = await this.firebaseApp.auth();
auth.onAuthStateChanged((user)=>{
if(user){
this.user = true
} else {
this.user = false
}
})
}
}
然后调用如下组件loadData
问题是当@user改变时,如何执行组件loadData内函数?
1条答案
按热度按时间wmtdaxz31#
Ember Octane原语还不能很好地支持当参数改变时触发一个动作。一种常见的方法是使用@ember/render-modifier或ember-render-helpers。
@ember/render-modifiers
提供一个{{did-update}}
* 修饰符 *。ember-render-helpers
提供一个{{did-update}}
* 帮助符 *。修饰符和帮助符都有一个函数作为第一个位置参数。只要其他位置参数之一发生更改,就会执行该函数。{{did-update}}
修饰符在所执行的函数需要访问DOM元素时很有用。它在调用时将其附加到的DOM元素设置为函数的参数。当执行的函数不需要访问DOM元素时,
{{did-update}}
帮助器非常有用。{{did-update}}
modifier 的主要用例是简化从传统@ember/component
到@glimmer/component
的迁移。几乎在所有情况下,包含逻辑的特定modifier(应该执行)本身是更好的解决方案。它提供更好的可重用性,可以单独测试,并且与使用它的组件有清晰的边界。{{did-update}}
helper 的主要用例是填补当前Ember Octance编程模型的空白。Ember Octance通过自动跟踪和原生getter为派生状态提供了极好的开发者体验。它提供了根据值修改DOM元素的极好体验。但它还没有很好的原语来触发参数更改时的数据加载等操作。社区目前正在尝试不同的方法来填补这个空白。它似乎是基于Chris Garret(pzuraq)在an RFC和in a recent blog post中提出的
@use
装饰器和资源。它可以作为ember-could-get-used-to-this包的一部分用于实验。ember-render-helpers
提供的{{did-update}}
助手是最成熟的解决方案,可以填补这一空白,直到像 resources 这样的东西在Ember中安顿下来。