props 是否仍然适用于 React 中的函数组件访问参数？

Question

我正在将 class 组件转换为函数组件。 Event组件以前是这样的：

class Event extends React.Component {
    //do something
  }

现在Event是函数组件：

function Event() {
  // do something
}

一些参数被传递给 Event 如下：

const EventScreen = (props) => (<Event {...props} name={name} address={address})

在classEvent中，name和address可以通过this.props.name和this.props.address访问。

将Event转换为函数组件后，如何访问name和address？可以是props.name和props.address吗？

Answer 1

你说的是使用 Function component； props 作为函数的第一个参数传递：

function Event(props) {
  // props.name etc exist
}

也可以解构，方便使用：

function Event({name, address}) {

}

Answer 2

是的，您可以这样访问它：

function Event(props) {
  //
}

Answer 3

其实在function component中不需要使用this，可以直接获取如下道具：

function Event(props) {
  console.log(props);
}

但我建议您使用 arrow function and destructuring assignment 作为功能组件，如下所示：

const Event = ({ name, address }) => {
  console.log(name, address);
}

Is props still good for function component accessing params in React?