По данным responsejs.org, компонентWillMount не будет поддерживаться в будущем.
https://reactjs.org/docs/react-component.html#unsafe_componentwillmount
Нет необходимости использовать componentWillMount.
Если вы хотите что-то сделать до монтирования компонента, просто сделайте это в конструкторе ().
Если вы хотите выполнять сетевые запросы, не делайте этого в componentWillMount. Это потому, что это приведет к неожиданным ошибкам.
Сетевые запросы могут быть выполнены в componentDidMount.
Надеюсь, поможет.
обновлено 08/03/2019
Причина, по которой вы запрашиваете componentWillMount, вероятно, заключается в том, что вы хотите инициализировать состояние перед рендерингом.
Просто сделайте это в useState.
const helloWorld=()=>{
const [value,setValue]=useState(0) //initialize your state here
return <p>{value}</p>
}
export default helloWorld;
или, может быть, вы хотите запустить функцию в componentWillMount, например, если ваш оригинальный код выглядит следующим образом:
componentWillMount(){
console.log('componentWillMount')
}
с помощью hook, все, что вам нужно сделать, это удалить метод жизненного цикла:
const hookComponent=()=>{
console.log('componentWillMount')
return <p>you have transfered componeWillMount from class component into hook </p>
}
Я просто хочу добавить что-то к первому ответу об использовании эффекта.
useEffect(()=>{})
useEffect запускается для каждого рендера, это комбинация componentDidUpdate, componentDidMount и ComponentWillUnmount.
useEffect(()=>{},[])
Если мы добавим пустой массив в useEffect, он будет запущен сразу после монтирования компонента. Это потому, что useEffect будет сравнивать массив, который вы ему передали. Так что это не должен быть пустой массив. Это может быть массив, который не изменяется. Например, это может быть [1,2,3] или ['1,2']. useEffect по-прежнему работает только при монтировании компонента.
От вас зависит, хотите ли вы, чтобы он запускался один раз или запускался после каждого рендера. Это не опасно, если вы забыли добавить массив, если знаете, что делаете.
Я создал образец для крючка. Пожалуйста, проверьте это.
https://codesandbox.io/s/kw6xj153wr
Обновлено 21/08/2019
Это был белый цвет, так как я написал ответ выше. Есть кое-что, на что, я думаю, нужно обратить внимание. Когда вы используете
useEffect(()=>{},[])
Когда реакция сравнивает значения, переданные в массив [], он использует Object.is () для сравнения. Если вы передаете объект, например,
useEffect(()=>{},[{name:'Tom'}])
Это точно так же, как:
useEffect(()=>{})
Он будет перерисовываться каждый раз, потому что когда Object.is () сравнивает объект, он сравнивает его ссылку, а не само значение. Это то же самое, что и то, почему {} === {} возвращает false, потому что их ссылки разные. Если вы все еще хотите сравнить сам объект, а не ссылку, вы можете сделать что-то вроде этого:
useEffect(()=>{},[JSON.stringify({name:'Tom'})])