Stencil JS - 使用 Prop 值启动 State 变量？

Question

在我的 Stencil 组件中，我想使用传递下来的 prop 值来启动我的状态变量。如何在模板中做到这一点？我尝试将值分配给 componentWillLoad 中的状态变量，但它不起作用。@Prop() passedVal @State() someVal = ??我是 Stencil 的新手，而且我来自 VueJS，所以请忍受我看似幼稚的问题。

Answer 1

最好观察 prop 的变化，然后更新状态。

@Component({ tag: 'my-comp' })

export class MyComp {

  @Prop() foo: string;

  @State() bar: string;

  @Watch('foo')

  onFooChange() {

    this.bar = this.foo;

  }

  componentWillLoad() {

    this.onFooChange();

  }

  render() {

    return this.foo + this.bar;

  }

}

您可以调用您的观察者方法，componentWillLoad因为观察只会在组件加载后开始。