您将如何修复或改进组件？

Question

class App extends React.Component {  
  constructor(props) {
    super(props);
    this.state = {
      name: this.props.name || 'Anonymous'
    }
  }    
  render() {
    return (
      <p>Hello {this.state.name}</p>
    );  
  }
}

通过执行以下命令来删除状态并使用道具？如果是这样，你怎么做？

getDerivedStateFromProps

还是（最好是）更改为功能组件？

期待建议！

Answer 1

这里是一个单行无状态组件：

const App = ({ name }) => <p>Hello {name || 'Anonymous'}</p>

它的行为与您的课堂完全相同