0

i have select when i add select it add also the option label and value that i already added i don't want the duplicated and when it duplicated the options look like array inside array in 0 : label : ['sad'] value : ['sad'] here the duplicated one 1 : label : [Array(1)] value : [Array(1)]

import Select from 'react-select';
import { useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import type { RootState } from '../store/store';
import Card from './Card';
import { addTarget } from '../store/FilterSlice';
import { MultiValue } from 'react-select';


function Selecting() {
  const data = useSelector((state: RootState) => state.data);
  const targets = useSelector((state: RootState) => state.target);
  const options = data?.map((items) => ({ value: items.tags, label: items.tags })) || [];
  const [selectedTags, setSelectedTags] = useState<{label: string}[]>([]);
  const dispatch = useDispatch()
  const handleChange = (newValue: MultiValue<string>) => {
    const tags = newValue.label.join(" ")
    setSelectedTags(tags);
    dispatch(addTarget(tags));
    console.log(options)
  };
  return (
    <>
        <form>
          <label className="block pb-2">Tags</label>
          <Select
            className="basic-single lg:w-[40.5rem]"
            classNamePrefix="select"
            name="color"
            options={options}
            value={selectedTags}
            onChange={handleChange}
          />
        </form>
    </>
  );
}

export default Selecting;

i want just the unsique label and value i tried filter and set methode but it doesn't work.

0 Answers0