首页 > 解决方案 > 从数组中检索标题

问题描述

我有一个简单的多选字段:

<MultiSelectText
    multiple={true}
    options={this.props.fields}
    onChange={this.handleChange}
    name="fields"
    label="fields"
    items={this.props.fields}
    sorting="sorting"
/>

我检索的数组看起来像这样:

[{name: 'Animals', label_parent: '', sorting: 1}, {name: 'Duck', label_parent: 'Animals', sorting: 2}, {name: 'Dog', label_parent: 'Animals', sorting: 3}, {name: 'Cat', label_parent: 'Animals', sorting: 4}, {name: 'Vehicles', label_parent: '', sorting: 5}, {name: 'Bike', label_parent: 'Vehicles', sorting: 6}, {name: 'Car', label_parent: 'Vehicles', sorting: 7}, {name: 'Motorcycle', label_parent: 'Vehicles', sorting: 8}];

目前我的多输入看起来像这样: 之前

但我需要它看起来像这样: 之后

我想在“label parent”为空的任何地方设置一个标签...对于所有其他字段,我将 label_parent 设置为“cat”或“vehicles”,并且它们需要在这些标签“类别”中显示为选择字段”。有没有办法显示多个 MultiInputTexts?

标签: javascriptarraysreactjs

解决方案


所以,我自己找到了解决方案。

基本上你想通过检查字符串过滤掉所有标签并创建一个新数组

 let animals = this.props.fields.filter(function (a) {
               return a.label === 'Animals';
 });

然后只需在您设置的地方创建一个每个 MultiInput

options={animals}

我想你也可以在这里做一个循环?


推荐阅读