Государство не может получить доступ к реквизиту
Я пытаюсь добавить selectedUserIds в конструктор состояний, используя userListIds из реквизита. Однако кажется, что в то время, когда конструктор выполняется, значение в props еще не установлено, поэтому я получаю null.
Однако, когда я печатаю this.props.userListIds в начале рендеринга, он отлично отображается. Проблема в другом. Какое может быть решение? Вот код:
const mapStateToProps = (state: State, props: OwnProps): PropsFromState => ({
userList: getCompanyTeamListSelector(state),
userListIds: state.ddls.companyUsers.map(element => Number(element.id))
});
@connect(mapStateToProps)
export default class EmailModal extends React.Component<OwnProps & Partial<PropsFromDispatch> & Partial<PropsFromState>, OwnState> {
constructor(props: OwnProps) {
super(props);
this.state = {
valueSelected: true, selectedUserIds: this.props.userListIds // HERE
}}
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Вы неправильно делаете React. Если к значению можно получить доступ в реквизитах, значение должно оставаться в реквизитах. Дублирование данных между реквизитами и состоянием может привести к бесполезному повторному рендерингу компонентов и, что наиболее важно, к множеству ошибок, особенно при подключении таких библиотек, как React-Redux, которые будут активно манипулировать реквизитами.
Да, и используйте в конструкторе props, а не this.props.
Свойства неизменяемы, и мне нужно, чтобы это значение было динамическим. Спасибо, попробую
Хорошо, это работает, так как теперь это две разные переменные, которые не нужно синхронизировать
Совершенно разумно инициализировать какое-то состояние из значения свойства.
@MatthewHerbst, глядя на код, оказалось, что userListIds должен быть идентичным в состоянии и в реквизитах, что позже было определено OP как ложное, но мое замечание о дублирование данные остаются (данные инициализация, однако, действительно вполне разумны )
Проблема в том, что userListIds находится в PropsFromState, а не в OwnProps, поэтому я не могу использовать props.userListIds. Я попробовал несколько решений, но ничего не помогло. Какое подходящее решение для этого?
Нашел способ использовать props вместо this.props, но это не сработало
Props - это внешний ресурс данных для компонента React, поэтому вы всегда должны предполагать, что данные props ненадежны, и заботиться о пустых / неопределенных props в вашем компоненте.
Данная функция конструктора выполняется перед первым рендерингом в жизненном цикле компонента, возможно, что во время выполнения функции конструктора props.userListIds может быть пустым, а в render он будет извлечен и готов к использованию. Если вы действительно хотите сохранить userListIds в локальном состоянии, вы можете использовать getDerivedStateFromProps для обновления локального состояния:
public static getDerivedStateFromProps(nextProps: IProps, prevState: IState) {
return (nextProps.userListIds != prevState.selectedUserIds) ?
{ selectedUserIds: nextProps.userListIds } :
null
}
Но так же, как и другие комментарии здесь, я также против идеи копирования реквизита в локальное состояние, поскольку у вас будет 2 отдельных источника истины для одного и того же фрагмента данных, и вам нужно будет обновлять локальное состояние всякий раз, когда ваши реквизиты меняются. Вместо этого вы можете рассмотреть возможность прямого использования props.userListIds.
Спасибо за ответ, но getDerivedStateFromProps тоже не сработал.
Просто используйте в конструкторе
props, а неthis.props