Динамически выбрать параметры из нескольких Выберите раскрывающийся список с Reactstrap в React JS - PullRequest
Новая
       13

Динамически выбрать параметры из нескольких Выберите раскрывающийся список с Reactstrap в React JS

1 голос
/ 13 мая 2019

У меня есть следующая функция: 

loadTag(data, td) {
    var tag = this.state.session.tag.map((el) => 
    $.inArray( el.name, data ) ? 
    <option key={el.name} value={el.key} defaultValue>{el.name}</option> : 
    <option key={el.name} value={el.key}>{el.name}</option>);
    ReactDOM.render(
      <Input type="select" className="dropselect_tag" name="tag" multiple>
        {tag}
      </Input>,
      td);
}

Я хочу иметь возможность динамически выбирать несколько параметров в списке параметров, представленных в раскрывающемся списке выбора. Для моего выпадающего списка я использую плагины reactstrap и select2, и он инициализируется, но ничего не выбрано.

Я пробовал это также: 

loadTag(data, td) {
    var tag = this.state.session.tag.map((el) => 
    <option key={el.name} value={el.key}>{el.name}</option>);
    ReactDOM.render(
      <Input type="select" className="dropselect_tag" defaultValue={data} name="tag" multiple>
        {tag}
      </Input>,
      td);
}

Но это не дает никакого результата. И я очень уверен, что отправляю такой массив, как этот ["item"]. Я анализирую свой массив из моей базы данных и проверяю так: 

 data = JSON.parse(data.replace(/&quot;/g,'"'));
 console.log(typeof data); 
 console.log(data);

Есть ли способ, которым я могу вытащить этот материал?

Ответы [ 2 ]

1 голос
/ 14 мая 2019

Я смог решить это следующим образом: 

loadTag(data, td) {
  data = JSON.parse(data.replace(/&quot;/g,'"'));
  var tag = this.state.session.tag.map((el) => <option key={el.index} value={el.index}>{el.index}</option>);
  ReactDOM.render(
      <Input type="select" multiple={true} defaultValue={data} className="dropselect_tag" name="tag">
        {tag}
      </Input>,
      td);
}
1 голос
/ 14 мая 2019

Мой совет - использовать реагировать на выбор, он может элегантно выбрать несколько.Можете ли вы попробовать?

npm install react-select

import React, { Component } from 'react'
import Select from 'react-select'

const options = [
  { value: 'chocolate', label: 'Chocolate' },
  { value: 'strawberry', label: 'Strawberry' },
  { value: 'vanilla', label: 'Vanilla' }
]

const MyComponent = () => (
  <Select options={options} />
)

ответные документы

...