I need return jsx in option. how to change string to any

[ChungLeba]

How to change string to any this

[manjushsh]

Hi @ChungLeba, You can try it with separate function as shown in this code sandbox

But remember, it is not recommended.

Code:

import "./styles.css";
import Select from "react-select";
import { useState } from "react";

const options = [
  { label: "apple", value: 1 },
  { label: "orange", value: 2 },
  { label: "kiwi", value: 3 }
];

export type SelectValueType = {
  [key: string]: string;
} | null;

export default function App() {
  const [value, setValue] = useState<SelectValueType>();

  const handleOption = (selection: SelectValueType) => {
    setValue(selection);
  };

  const getOptionLabelFn = (option: any): any => (
    <>
      <mark>{option.label}</mark>
      <hr />
    </>
  );

  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <Select
        options={options}
        onChange={handleOption}
        getOptionLabel={getOptionLabelFn}
      />

      <div
        className={`my-3 alert ${
          value?.label ? "alert-success" : "alert-danger"
        }`}
        role="alert"
        style={{ position: "absolute", bottom: 0, width: "96%" }}
      >
        {value?.label
          ? `You selected the ${value?.label} with the value ${value?.value}`
          : "You haven't selected any option"}
      </div>
    </div>
  );
}

[ChungLeba]

thansk manjushsh