在元素变量中反应存储状态

Question

我想知道如何在可能的情况下将状态存储在存储在变量中的元素中。

这是我的简化代码：

export class DashboardLists extends Component{
constructor(props){
    super(props);

    this.state = {
        listCount: 0,
        ...
    }

    ...

    this.headerLeft = <h2 style={{marginTop: "0px"}}>Lists {this.state.listCount}</h2>;

    ...
}

render(){
    return(
          <div>
              ...
              {this.headerLeft}
              ...
          </div>
    );
}
}

当我调用状态更改时，元素中的值不显示更新后的状态值。

我有必要将元素存储在变量中，因为在我的完整代码中我必须将元素作为 prop 传递给另一个元素。

Answer 1

从构造函数中删除 headerLeft。在 class 中创建一个专用方法，类似于 getHeaderLeft() {return <h2 style={{marginTop: "0px"}}>Lists {this.state.listCount}</h2>;} 并在渲染方法 {this.getHeaderLeft()}

中调用它

-康斯坦丁·萨马林

在元素变量中反应存储状态

React storing state in an element variable

javascript

reactjs

jsx

react-state