React JS：检查输入值中的逗号

Question

我有一个带有嵌套对象数组的状态对象，称为“axisLabels”。如果用户要在输入中输入任何内容，我想检查输入的 event.target.value 中是否有逗号（逗号分隔）以更新数组中的第二个对象。这怎么可能？我当前的功能代码更新了两者。状态对象：selectedTemplateData: {   axisLabels: ['Option 1', 'Option 2']}更新数组的函数：axisChange(event) {    event.persist();    this.setState(prevState => ({        selectedTemplateData: {            ...prevState.selectedTemplateData,            Axislables: [event.target.value, event.target.value]        }    }))}用法：<input type="text"  onChange={(event) => this.axisChange(event)} />

Answer 1

这肯定会奏效：

axisChange(event) {

    event.persist();

    this.setState(prevState => ({

        selectedTemplateData: {

            ...prevState.selectedTemplateData,

            Axislables: [...event.target.value.split(',')]

        }

    }))

}

如果没有逗号，则将保留该值。如果有逗号，您可以拆分这些值并将它们分散到新数组中。

Answer 2

在这里您会找到其他示例，但一个简单的方法如下：

axisChange(event) {

    event.persist();

    const e = event && event.target && event.target.value;

    const values = e && e.split(',').length > 1

      ? e.split(',')

      : e;

    this.setState(prevState => ({

        selectedTemplateData: {

            ...prevState.selectedTemplateData,

            Axislables: [ values[0], values[1], values[n] ]

        }

    }))

}