2 votes

les accessoires créables ne fonctionnent pas dans le composant react-virtualized-select

J'utilise les accessoires "Creatable" de react-virtualized-select . Lorsque j'écris une option personnalisée (par exemple, code de test 4), le texte ' est affiché. créer l'option "Code de test 4" . Mais lorsque je clique sur cette option, le menu déroulant devient vide et cette option n'est pas non plus ajoutée à la liste des options.

Lien de la bibliothèque vers la démo : https://bvaughn.github.io/react-virtualized-select/

Bibliothèque Lien vers la démo Code source : https://github.com/bvaughn/react-virtualized-select/blob/master/source/VirtualizedSelect/VirtualizedSelect.example.js

Options : La liste ci-dessous provient de la base de données. dataSource = [ {name: "Test1", label: "Test code 1", type: "text"}, {name: "Test2", label: "Test code 2", type: "text"}, {name: "Test3", label: "Test code 3", type: "text"} ]

Composant :

import { Creatable } from 'react-select'

handleOptionChange( selectedValue ) {
   this.setState({
     selectedValue: selectedValue
   });
}

<VirtualizedSelect
   labelKey='label'
   clearable={ clearable }
   disabled={ disabled }
   multi={multi}
   handleOptionChange={this.handleOptionChange}
   options={ dataSource }
   searchable={ searchable }
   selectedValue={ selectedValue }          
   selectComponent={Creatable}
   valueKey='name'
/>

Je n'arrive pas à comprendre ce que j'ai manqué d'autre ?

Merci d'avance.

0voto

J'ai eu le même problème. Dans mon cas, le problème était dû à la version de react-select. J'ai mis à jour react-select de 0.9.2 à v1.2.1 et cela a réglé le problème :

"react-select": "v1.2.1"

J'ai également ajouté les importations suivantes qui sont présentes dans certains exemples (je ne sais pas si c'est crucial) :

import React, { Component, PropTypes  } from 'react';

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X