如何删除 react select 选项中的重复标签和值

问题描述 投票:0回答:0

我在添加时选择了选择它还添加了我已经添加的选项标签和值我不希望重复并且当它重复时选项看起来像0中的数组内部数组:标签:['sad']值: ['sad'] 这里是重复的 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;

我只想要独特的标签和价值我试过过滤器和设置方法但它不起作用。

reactjs redux react-redux redux-toolkit react-select
© www.soinside.com 2019 - 2024. All rights reserved.