Реквизит все еще хорош для доступа к компонентам функций в React?

Question

Я преобразовываю компонент класса в компонент функции. Event компонент раньше был таким:

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

Теперь Event является функциональным компонентом:

function Event() {
  // do something
}

Некоторые параметры передаются в Event, как показано ниже:

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

В классе Event к name и address можно получить доступ через this.props.name и this.props.address.

После преобразования Event в компонент функции, как получить доступ к name и address? Это может быть props.name и props.address?

Answer 1

Вы говорите об использовании Компонента функции ; props передается в качестве первого аргумента функции:

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

Вы также можете выполнить деконструкцию для более легкого использования:

function Event({name, address}) {

}

Answer 2

На самом деле, в function component нет необходимости использовать this, вы можете получить прямой доступ к реквизиту, как показано ниже:

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

Но я предлагаю вам используйте функцию стрелки и назначение деструктурирования для компонента функции, как показано ниже:

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

Answer 3

Да, вы получаете к нему доступ таким образом:

function Event(props) {
  //
}