Есть ли проблема с установкой состояния React.Component равным значению this.props в машинописном тексте?
Я пытаюсь назначить объект, который передается в React.Component как свойство, такому значению состояния,
state = {
rota: this.props.rota
}
render() {
// const { cleaning, chairs, creche, flowers } = this.state.rota;
const { cleaning, chairs, creche, flowers } = this.props.rota;
console.info(creche);
}
Закомментированный раздел, где он получает значение состояния, распечатывает пустую строку, однако значения свойств верны. Я что-то делаю неправильно при назначении props.rota на state.rota?
Я использую машинописный текст и сделал именно это в другом месте своей программы, однако передаваемое свойство было типом значения (строкой), а не типом объекта.
Спасибо!
зачем вам это делать, если вы в любом случае передаете реквизиты компоненту? если вы хотите, чтобы снимок свойств отображал состояние, вы можете использовать componentDidUpdate (prev, next) {this.setState ()}
@joelgullander componentWillReceiveProps устарел. Вы не должны использовать это
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Обычно это плохая практика.
Возьми свой случай.
Вы получаете значение как опору от родительского компонента.
Внутренний компонент уже будет повторно визуализироваться каждый раз, когда это значение изменяется в родительском компоненте.
Если вы воспользуетесь подходом, подобным вашему, то, что, скорее всего, вы сделаете, это также измените это значение внутри внутреннего компонента (через состояние), изменения которого не будут отражены на родительском компоненте.
Фактически вы нарушаете шаблон проектирования однонаправленного потока данных, от которого во многом зависит реакция.
Так что мое личное мнение - в данном случае нужно поднять состояние и избегать подобных ситуаций. Вместо этого используйте обратные вызовы, если вы хотите сообщить об изменениях родительскому объекту или использовать некоторое управление состоянием (контекст, сокращение и т. д.).
Или спроектируйте лучшее решение, используя HOC или компоненты рендеринга props.
Моя причина в том, что этот компонент является модальной формой ввода - я передаю начальные значения для некоторых текстовых полей, которые могут / не могут быть изменены - при передаче изменений я хочу включить только новые изменения и сохранить любые неизменные значения . Отвечая вам, я подумал о возможном способе исправить это, поскольку я знаю, что props-state - это антипаттерн!
Используйте обратный вызов, переданный от родительского компонента к внутреннему, который будет вызываться, когда модальное окно будет закрыто, передавая новые значения обратно родительскому компоненту. Затем обновите родительский элемент внутри этого обратного вызова
Несмотря на то, что @quirimmo в значительной степени ответил на ваш вопрос, если вы хотите сделать это когда-нибудь в будущем, самым простым способом было бы использовать функцию конструктора и передать реквизиты в качестве параметра, а затем просто установить это как значение по умолчанию государства
class SomeComponent extends Component {
constructor(props){
super(props);
this.state = {
rota: props.rota,
}
}
}
Это гарантирует, что опора действительно доступна в тот момент, когда вы хотите установить начальное состояние, поскольку конструктор - это первая функция, которая вызывается в жизненном цикле компонента.
Где вы устанавливаете это состояние? Если он находится внутри конструктора, то на этом этапе реквизиты не инициализируются, так что это может быть вашей проблемой. Вместо этого попробуйте использовать
getDerivedStateFromProps, который на самом деле предназначен именно для этого случая (reactjs.org/docs/…)