Question

我有一个简单的组件，可以从父母那里获得道具：

render(){
    const {message} = this.props;

    if(message){
        let {title, text} = message;
    } else {

        let title= 56;
        let text= 34;
        console.log('inside')
        console.log(title);
    }

    console.log('outside');
    console.log(lat);

    return( // JSX) // The vars are not used

当我运行它时，message是未定义的，并且在控制台中看到inside和54。之后，outside和ReferenceError: title is not defined。如果我在if / else外复制/粘贴let title= 56;，一切正常。对于在所有情况下进行调试，都未定义message。为什么呢？

Answer 1

用let定义的变量是块范围的，因此它们将不存在于if / else块之外。您可以在if / else之前定义它们，而只是在其中分配值。

class App extends React.Component {
  render() {
    const { message } = this.props;
    let title, message;

    if (message) {
      title = message.title;
      text = message.text;
    } else {
      title = 56;
      text = 34;
    }

    return <>{/* ... */}</>;
  }
}

未定义的变量，在渲染方法React

1 个答案: