在 componentDidUpdate 中无法访问的状态

Posted 2023-02-02

我目前正在学习React Hooks。

我试图将状态值访问到我的类组件的componentDidUpdate()函数中，然而它并没有显示出来，我无法找出原因。相反，在 componentDidMount()函数中可以访问相同的状态值。

谁能帮助我了解一下可能的问题和可能的解决方案，因为同样的例子在youtube教程中工作得很好 (联系)我指的是。

CodeSandBox的链接。链接

示例代码

import React,  Component  from "react";

class ClassCounter extends Component 
  constructor(props) 
    super(props);

    this.state = 
      count: 0
    ;
  

  componentDidMount() 
    document.title = "Clicked this.state.count times.";
  

  componentDidUpdate(prevProps, prevState) 
    document.title = "Clicked this.state.count times.";
    alert("Clicked $this.state.count times.");
  

  render() 
    return (
      <div>
        <p>From Class Component.</p>
        <p>You clicked this.state.count number of times.</p>
        <button onClick=() => this.setState( count: this.state.count + 1 )>
          Clicked this.state.count times.
        </button>
      </div>
    );
  


export default ClassCounter;

答案

你的字符串插值语法在 componentDidMount 并在 componentDidUpdate 是错误的，正确的语法。

document.title = `Clicked $this.state.count times.`;

请注意回车键（`）和$字符。

另一答案

你使用的是错误的语法，请使用 ``

    componentDidMount() 
    document.title = `Clicked $this.state.count times.`;
  

  componentDidUpdate(prevProps, prevState) 
    document.title = `Clicked $this.state.count times.`;
    alert(`Clicked $this.state.count times.`);