Breaking News: Grepper is joining You.com. Read the official announcement!

creatable select react

Michelle Hofer answered on July 7, 2022 Popularity 9/10 Helpfulness 4/10

answer creatable select react

creatable select react

Comment

import React, { Component } from 'react';

import CreatableSelect from 'react-select/creatable';
import { ColourOption, colourOptions } from '../data';
import { ActionMeta, OnChangeValue } from 'react-select';

export default class CreatableSingle extends Component {
  handleChange = (
    newValue: OnChangeValue<ColourOption, false>,
    actionMeta: ActionMeta<ColourOption>
  ) => {
    console.group('Value Changed');
    console.log(newValue);
    console.log(`action: ${actionMeta.action}`);
    console.groupEnd();
  };
  handleInputChange = (inputValue: any, actionMeta: any) => {
    console.group('Input Changed');
    console.log(inputValue);
    console.log(`action: ${actionMeta.action}`);
    console.groupEnd();
  };
  render() {
    return (
      <CreatableSelect
        isClearable
        onChange={this.handleChange}
        onInputChange={this.handleInputChange}
        options={colourOptions}
      />
    );
  }
}

Popularity 9/10 Helpfulness 4/10 Language javascript

Source: react-select.com

Tags: javascript select

Link to this answer
Share Copy Link

Contributed on Jul 07 2022

Michelle Hofer

0 Answers Avg Quality 2/10

creatable select react

Contents

More Related Answers

creatable select react

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.