#reactjs
#reactjs
Вопрос:
Я новичок в React,
Я хотел бы знать, есть ли какой-либо способ узнать, была ли вызвана функция рендеринга из-за родительской модификации (реквизит) или из-за изменения внутреннего состояния?
Допустим, у меня есть <input type"text" />
. Я бы хотел, чтобы его значение менялось при нажатии клавиши (функция onChange) или при каждом изменении реквизита (от родителя)
Комментарии:
1. вы не видите html, который вы ввели в метод рендеринга?
2. Не понимаю вашего комментария
3. обычно метод рендеринга содержит некоторый HTML-код внутри return() . если у вас есть div, содержащий p-тег с надписью «test», и вы видите «test», отображаемый в вашем браузере, вы бы точно знали, что он вызывается
4. Я обновил свой вопрос, согласно вашему ответу, похоже, что он был недостаточно ясным
Ответ №1:
Вы можете сравнить свои старые и новые реквизиты и состояние:
componentDidUpdate(prevProps, prevState) {
Object.entries(this.props).forEach(([key, val]) =>
prevProps[key] !== val amp;amp; console.log(`${key} prop was changed`)
);
Object.entries(this.state).forEach(([key, val]) =>
prevState[key] !== val amp;amp; console.log(`${key} state changed`)
);
}
Комментарии:
1. Почему вы используете
componentDidUpdate
, а неcomponentWillUpdate
используете?2.
componentWillUpdate
теперь НЕБЕЗОПАСНО reactjs.org/docs /… но, если вы хотите сделать свою проверку передrender
методом, вы можете использовать `getSnapshotBeforeUpdate ()`3. Спасибо за ваш ответ (я дал 1), но он не отвечает на мой вопрос. Возможно, я был недостаточно ясен, поэтому я обновил свой вопрос
Ответ №2:
Вы можете просто добавить console.log(this.props) или (props) в зависимости от случая, внутри функции рендеринга, и она будет регистрировать реквизиты на консоли.