Javascript 为什么不是'；状态变量显示在标题中，但常量是？

我的代码是：

import React, { Component } from 'react';

class App extends Component {
  state: {
    title: "Graphs"
  }

  render() {
    return (
      <div>
        <h1>
          {this.state.title}
        </h1>
      </div>
    );
  }
}

export default App;

import React，{Component}来自'React'；
类应用程序扩展组件{
声明：{
标题：“图表”
}
render（）{
返回(
{this.state.title}
);
}
}
导出默认应用程序；

但是当我运行它时，不会显示“图形”。但是，如果我做了几乎相同的事情，但将标题更改为

<h1>
  Graphs
</h1>

图

---

然后它会正确显示。为什么第一种方法不起作用？

您必须在类字段的

状态
之后写一个等号
=
，而不是冒号
：

class App extends Component {
  state = {
    title: "Graphs"
  };

  render() {
    return (
      <div>
        <h1>{this.state.title}</h1>
      </div>
    );
  }
}

类应用程序扩展组件{
状态={
标题：“图表”
};
render（）{
返回(
{this.state.title}
);
}
}
类应用程序扩展组件{
状态={
标题：“图表”
};
//或者你可以初始化
//在构造函数中
//构造函数（）{
//超级（）
//this.state={title:“Graphics”}
//}
render（）{
返回(
{this.state.title}
);
}
}
将
状态：{…}
更改为
this.state={…}
class App extends Component {
  state = {
    title: "Graphs"
  };
  //or you can initialize 
  //in constructor
  //constructor(){
  // super()
  // this.state = {title: "Graphics"}
  //}
  render() {
    return (
      <div>
        <h1>{this.state.title}</h1>
      </div>
    );
  }
}