Question

我有一个Semantic-UI模式，它包含一个redux-form，因为它是内容。打开模态时，我将表单传递给它的内容道具。表单元素的initialValues道具设置为映射到状态的道具。

                <FormModal
                    handleSubmit={ this.sortSubmit }
                    size='small'
                    formName='sortForm'
                    header='Sort'
                    headerIcon='sort'
                    content={
                        <SortForm table={ this.props.table } initialValues={ { orderBy: this.props.search.orderBy, orderDirection: this.props.search.orderDirection } } />
                    }
                    trigger={
                        <Button icon floated='right' size="mini">
                            <Icon name='sort' />
                        </Button>
                    }
                />

然后我通过更改redux状态来更改this.props.search.orderBy。应用程序中的所有内容都会更新以反映更改，但此redux-form的initialValues除外，它应在状态更改时更改。我再次打开模态，字段被重置为旧的initialValues而不是新设置的值。

为什么会发生这种情况的任何想法？

在一个可能相关的说明中，重新渲染模态JSX似乎并没有关闭模态。由于模态的初始状态是关闭的，我会假设重新渲染它会重新关闭它。

Answer 1

您需要将enableReinitialize={true}传递给您的表单。

因为enableReinitialize默认为false。在这种情况下，initialValues仅适用于componentWillMount。

以下是有关enableReinitialize的文档部分：

设置为true时，表单将每次重新初始化 initialValues prop改变。默认为false。如果 keepDirtyOnReinitialize选项也设置，表单将保留重新初始化时脏字段的值。

有关详情，请参阅reduxForm

即使他们设置的状态，InitalValues也不会改变

1 个答案: