如果 ES6 有条件地存在，你将如何将 append 添加到 objects 属性？答案

【问题标题】：How would you add append to an objects property if it exists conditionally with ES6?如果 ES6 有条件地存在，你将如何将 append 添加到 objects 属性？
【发布时间】：2020-02-27 19:42:53
【问题描述】：

想象一下，如果有一个具有以下属性的对象。

var rules = {
 confirmedPassword: 'required|min:4|max:10',
}

我想要的是这个：

rules = { rules.confirmedPassword && {...rules.confirmedPassword, rules.confirmedPassword: '|same:password'}}

要产生这个：

rules = {confirmedPassword: 'required|min:4|max:10|same:password',}

原因是，在反应中，我在函数中使用event.target 稍后执行验证。

因此，如果用户使用name="confirmPassword" 来点击input 元素，它不仅会有默认的required|min:4|max:10，而且实际上是'required|min:4|max:10|same:password';

validateInputs(event) {
    var { password, confirmPassword } = this.state;
    var { name, value } = event.target;

    var data = {
      password: password,
      confirmPassword: confirmPassword
    };

    var rules = {};
    rules[name] = 'required|min:4|max:10';

    var messages = {
      'password.min': 'Password is too short.',
      'password.max': 'Password is too long.',
      'confirmPassword.min': 'Password is too short.',
      'confirmPassword.max': 'Password is too long.'
    };

    validate(data, rules, messages)
      .then(feedback => console.log(feedback))
      .catch(errors => console.log('foo', errors));

    this.setState({
      [name]: value
    });
  }

提前致谢！

【问题讨论】：

标签： ecmascript-6 javascript-objects

【解决方案1】：

您可以做的是将属性存储在一个数组中，然后在进行过程中加入和/或删除它们。

例如，假设您有 4 个输入，您可以像这样拥有整个组件：

import React from 'react';

export default class TestComponent extends React.Component {
    DEFAULT_RULES = ['required', 'min:4', 'max:10'];

    validateInputs(event) {
        const { password, confirmPassword } = this.state;
        const { name, value } = event.target;

        // This can be done this way in ES6, you don't need to do password: password
        const data = {
            password,
            confirmPassword
        };

        let rules = {};
        const rulesArr = this.DEFAULT_RULES.concat('same:password');
        rules[name] = rulesArr.join('|');

        validate(data, rules, messages)
            .then(feedback => console.log(feedback))
            .catch(errors => console.log('foo', errors));

        this.setState({
            [name]: value
        });
    }
}

我可能没有完整的上下文，但我希望你能明白这里发生了什么

【讨论】：