React将html元素标题更改为函数返回的结果

Question

基本上我有一些现有的元素，它显然很有用，但我想要一个动态名称：

<MenuItem primaryText='Foo Name'/>

但是我怎样才能使它成为可行的，元素的文本可以改变：

<MenuItem primaryText={this.foo}/>

基本上，函数foo根据组件状态返回两个字符串中的一个。 e.g：

foo() {
  if (this.state.show === true) {
    return 'Hide';
  } else {
    return 'Show';
  }
}

Answer 1

如果需要函数的返回值，则需要调用它。 在这种情况下 - this.foo()：

<MenuItem primaryText={this.foo()}/>