如何在Reactjs中使用Select2？ [英] How to use Select2 with Reactjs?

问题描述

我有这样的依赖字段

    <List>
     <select>
      <option></option>
      <option></option>
     </select>
     <select>
      <option></option>
      <option></option>
     </select>
     <input />
   </List>

如果我有5 < List /> 组件。如何为每个组件添加 Select2 。我在网上搜索。但找不到任何工作解决方案。

If I had 5 <List/> components.How do I add Select2 to each component.I googled online.But couldn't find any working solution.

以下代码 反应选择 。获取错误 TypeError：event.target未定义。

var React = require('react');
var ReactDOM = require('react-dom');
var Select = require('react-select');

var Page = React.createClass({

    getInitialState: function () {
        return {
            firstValue: ''
        }
    },

    handleFirstLevelChange : function (event) {
        this.setState({
            firstValue: event.target.value
        });
    },
    render : function(){

        var options = [
            { value: '', label: 'Select an option' },
            { value: 'one', label: 'One' },
            { value: 'two', label: 'Two' }
        ];

        return (<Select
            value={this.state.firstValue}
            options={options}
            onChange={this.handleFirstLevelChange}
            />)
    }
});

ReactDOM.render(<Page />, document.getElementById('root'));

推荐答案

我们正在使用这个包装器，但周围有太多问题。

We are using this wrapper, but there are too many problems around it.

首先，由于这个问题，你无法测试在NodeJS中使用它的代码。
其次我们通过 defaultValue 参数初始化各种select2组件时出现问题。只有一个（随机）这些元素被初始化。

First of all, you can't test code where it is used in NodeJS, because of this issue. Secondly we had problems with initialization of various select2 components via defaultValue parameter. Only one (randomly) of these elements was initalized.

因此我们要转储它并替换为 react-select 很快。

Therefore we going to dump it and replace with react-select soon.

编辑：我们用 react-select替换了 react-select2-wrapper 。它对我们很有用。

We replaced react-select2-wrapper with react-select. It works great for us.

这篇关于如何在Reactjs中使用Select2？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！