Инициализируйте значения, которые не являются полями, чтобы сохранить исходное состояние - PullRequest
0 голосов
/ 28 февраля 2019

У меня есть форма с тремя полями, а под полями - таблица его:

<Form name="accountEdit" onSubmit={handleSubmit(this.onSubmit)}>
    <Form.Group widths="equal">
    <Field name="label" label="Label" component={Form.Input} />
    <Field name="address" label="Address" component={Form.Input} />
    <Field name="active" label="Active" component={renderCheckbox} />
</Form.Group>

<Table celled striped>
    <Table.Header>
        <Table.Row>
            <Table.HeaderCell colSpan="4">Owners</Table.HeaderCell>
            <Table.HeaderCell colSpan="4" textAlign="center">
                <Button
                    type="button"
                    icon="add"
                    onClick={this.onClickOwnerAdd}
                  />
            </Table.HeaderCell>
        </Table.Row>

        <Table.Row>
            <Table.HeaderCell>User Name</Table.HeaderCell>
            <Table.HeaderCell>First Name</Table.HeaderCell>
            <Table.HeaderCell>Last Name</Table.HeaderCell>
            <Table.HeaderCell>Email Address</Table.HeaderCell>
            <Table.HeaderCell collapsing>Action</Table.HeaderCell>
        </Table.Row>
    </Table.Header>

    <Table.Body>
        {owners.map((owner, i) => {
            return this.ownerRow(owner, i);
        })}
    </Table.Body>
</Table>

Когда вызывается this.onClickOwnerAdd (), в таблицу добавляется новый владелец.Но я бы хотел сохранить исходное состояние.У меня также есть кнопка «Сохранить» и «Отмена».При нажатии кнопки «Отмена» значение for должно вернуться к исходным значениям.Он отлично работает с полями ввода, но массив владельцев не вернется к исходным значениям.

Вот состояние формы перед добавлением владельца:

form: {…}
​​    accountEdit: {…}
        anyTouched: true
        fields: Object { label: {…}, address: {…}, active: {…} }
​​​         initial: {…}
​​​​            accountID: "70986b07"
​​​​            active: false
            address: "D4VQ5YdHf7hLQ2gWQYYrcxoE5B7nWuDFNF"
​​​​            createdAt: "2019"
​​​​            createdBy: "Damian Hischier"
​​​​            label: "This is account 2"
​​​​            owners: Array [ {…}, {…} ]
​​​​            __proto__: Object { … }
​​​         registeredFields: Object { label: {…}, address: {…}, active: {…} }
​​​         submitSucceeded: true
​​​         values: {…}
​​​​            accountID: "70986b07"
​​​​            active: false
​​​​            address: "D4VQ5YdHf7hLQ2gWQYYrcxoE5B7nWuDFNF"
​​​​            createdAt: "2019"
​​​​            createdBy: "Damian Hischier"
​​​​            label: "This is account 2 Modified"
​​​​            owners: Array [ {…}, {…} ]
            __proto__: Object { … }
​​​        __proto__: Object { … }
    __proto__: Object { … }
__proto__: Object { … }

После добавления владельца начальные значения также обновляются, но я хотел бы сохранить начальные значения, на случай, еслинажата кнопка «Отмена».

Вот состояние после добавления владельца:


form: {…}
​​    accountEdit: {…}
        anyTouched: true
        fields: Object { label: {…}, address: {…}, active: {…} }
​​​         initial: {…}
​​​​            accountID: "70986b07"
​​​​            active: false
            address: "D4VQ5YdHf7hLQ2gWQYYrcxoE5B7nWuDFNF"
​​​​            createdAt: "2019"
​​​​            createdBy: "Damian Hischier"
​​​​            label: "This is account 2"
​​​​            owners: Array [ {…}, {…}, {…} ]
​​​​            __proto__: Object { … }
​​​         registeredFields: Object { label: {…}, address: {…}, active: {…} }
​​​         submitSucceeded: true
​​​         values: {…}
​​​​            accountID: "70986b07"
​​​​            active: false
​​​​            address: "D4VQ5YdHf7hLQ2gWQYYrcxoE5B7nWuDFNF"
​​​​            createdAt: "2019"
​​​​            createdBy: "Damian Hischier"
​​​​            label: "This is account 2 Modified"
​​​​            owners: Array [ {…}, {…}, {…} ]
            __proto__: Object { … }
​​​        __proto__: Object { … }
    __proto__: Object { … }
__proto__: Object { … }


Моя цель состоит в том, чтобы иметь только двух владельцев с начальными и тремя значениями.Как я могу добиться этого?

Вот мои функции reduxForm () и connect ():

componentWillMount() {
    console.log('componentDidMount');
    this.props.initialize(Object.assign({}, this.props.account));
}

const AccountEditForm = reduxForm(
  {
    form: 'accountEdit',
    fields: ['label', 'address', 'active', 'owners']
  }
)(ConnectedAccountEdit);

const AccountEdit = withRouter(
  compose(
    connect(
      mapStateToProps,
      actions
    )
  )(AccountEditForm)
);

Можно ли сохранить значения в начальном состоянии в форме избыточного числа, если онине рассматриваются как поля?

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