javascript - 在 React 组件的渲染函数中使用变量

Question

我正在学习 React 并且遇到一个疑问，有两段代码在不同的地方声明了组件中 render 方法使用的变量，我的疑问是为什么一个有效而另一个不有效。

import React from 'react';
import ReactDOM from 'reactDOM';

const myVar = 'hello';

class myComponent extends React.Component {
    render () {
       return <h1>{myVar}</h1>;
    }
}

ReactDOM(
    <myComponent />,
    document.getElementById('app')
);

这有效，意味着我可以在渲染方法中访问全局变量。

但以这种情况为例，这是行不通的

import React from 'react';
import ReactDOM from 'reactDOM';

class myComponent extends React.Component {
    const myVar = 'hello';

    render () {
       return <h1>{this.myVar}</h1>;
    }
}

ReactDOM(
    <myComponent />,
    document.getElementById('app')
);

我在这里很困惑，谁能解释一下这种行为

Answer 1

在类中你没有定义变量。您只需编写 myVar='hello' 而不是 const myVar='hello'

Properties specified in a class definition are assigned the same attributes as if they appeared in an object literal.