Tengo un campo de selección de reacción en el que se pueden realizar búsquedas en el que paso HTML al valor label. La búsqueda funciona antes de agregar HTML, pero después, como es comprensible, ya no funciona. ¿Hay algo específico que pueda hacer para reparar la capacidad de búsqueda al pasar HTML a la etiqueta?

La respuesta a mi pregunta original (¿puede pasar HTML a la etiqueta) fue respondida por esta publicación: react-select escapa de los caracteres html

  [
    { value: 'foo', label: <span dangerouslySetInnerHTML={{ __html: 'bar &amp; foo' }} /> },
  ]
1
Vim Diesel 27 jul. 2020 a las 21:27

1 respuesta

La mejor respuesta

Si observa el código de GitHub para react-select: https://github.com/JedWatson/react-select/blob/79c9e9deedaa57885d30aa8f19d1892d39e4d236/packages/react-select/src/types.js#L118

Verá que la etiqueta solo admite una cadena. Creo que necesitas usar esta función formatOptionLabel

<Select
    multi={true}
    options={this.state.options}
    onChange={this.handleOnChange.bind(this)}
    value={this.state.multiValue}
    formatOptionLabel={function(data) {
        return (
            <span dangerouslySetInnerHTML={{ __html: data.label }} />
        );
    }}
    isSearchable={true}
    placeholder="eee"
/>


2
Vim Diesel 28 jul. 2020 a las 13:48