Using the react-select to create the markup using bootstrap 4

前端 未结 1 770
天命终不由人
天命终不由人 2021-01-17 06:36

I am new to the react-redux. Here I am trying to achieve the following markup

So from Here what I achieved using the following code is ,

<
相关标签:
1条回答
  • 2021-01-17 07:13

    You need to update the style of your selects like the following lines:

    const styles = {
      container: base => ({
        ...base,
        flex: 1
      })
    };
    
    function App() {
      return (
        <div className="row">
          <div className="col-12">
            <form className="form-inline">
              <div className="form-group col-4">
                <lable>Select Technolgoy </lable>
                <Select styles={styles} options={options} />
              </div>
              <div className="form-group col-4">
                <lable>Select Component </lable>
                <Select styles={styles} options={options} />
              </div>
              <div className="form-group col-4 row">
                <lable className="col-4">Select Job </lable>
                <button className="btn btn-primary col-4">Add</button>
                <button className="btn btn-primary col-4">Remove</button>
              </div>
            </form>
          </div>
        </div>
      );
    }
    

    Here a live example.

    0 讨论(0)
提交回复
热议问题