Как связать повторный рендеринг компонента с объектом, который содержит реквизиты в React - PullRequest
0 голосов
/ 15 мая 2019

У меня есть компонент, связанный с редуктором Redux (languageReducer), который содержит тексты локализации. Этот компонент содержит локальную переменную («поля», массив jsons), которая отправляется с использованием реквизита дочернему компоненту для визуализации некоторых входных данных. Проблема в том, что при изменении языка из Redux компонент, который отображает эти входные данные, не перерисовывается, потому что он не связан с языковым редуктором, а с объектом, который содержит ключи от языкового редуктора.

Решение будет состоять в том, чтобы переместить это локальное поле в состояние и использовать componentDidUpdate / getDerivedStateFromProps и выполнить быстрое-глубокое-равное в подпорках. Но есть ли более элегантное решение?

class UserForm extends Component {

    initialFields = [
        { value: '', type: 'autoCompletionInput', label: this.props.languageReducer.labels.provider, name: 'providerId', options: [] },
        { value: '', type: 'text', label: this.props.languageReducer.labels.name, name: 'username' },
        { value: '', type: 'text', label: this.props.languageReducer.labels.fullName, name: 'fullName' },
        { value: '', type: 'password', label: this.props.languageReducer.labels.password, name: 'password' },
        { value: '', type: 'password', label: this.props.languageReducer.labels.retypePassword, name: 'retypePassword' },
        { value: true, type: 'checkbox', label: this.props.languageReducer.labels.isActive, name: 'isActive'}
    ]

    render(){
       return <InputGenerator fields={this.initialFields} />
    }

}

const mapStateToProps = reducers => ({
    languageReducer: reducers.languageReducer.i18n.user
})

export default connect(mapStateToProps, null)(UserForm)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...