1

UI Kitten の Select コンポーネントに表示するオプションの API からデータを取得しています

データ形式はこんな感じ

const data = [
    {
       "id": 1, 
       "name": "General",
    },
    {
       "id": 2, 
       "name": "Other Category",
    },
    {
       "id": 3, 
       "name": "Public transport",
    },
    {
       "id": 4, 
       "name": "Help Support",
    }
]

ドロップダウンにデータを表示していますが、選択した後に表示されていますが、option1, option 2元のデータを表示しonselectたいのですが、デフォルトではインデックスから始まるインデックスを取得しているため、選択したオプションの元のIDを取得したいです0

利用した

  const [selectedIndex, setSelectedIndex] = useState(new IndexPath(0));

このようにデータを表示しています

<Select
  selectedIndex={selectedIndex}
  status="basic"
  style={[STYLES.input]}
  value={selectedIndex}
  size="large"
  onSelect={(index) => handleFaqCategorySelection(index)}
>
  {data.map((item) => (
    <SelectItem title={item.name} index={item.id} />
  ))}
</Select>;

それを行う方法はありますか？動的データの処理方法が明確でないため、ドキュメントを試しました

前もって感謝します

4

1 に答える 1

0

私には無意味ですが、選択したオプションのラベルを設定するには、オプションを再度フィルタリングして割り当てる方法しかありませんvalue。より良い方法が見つかるまで、以下のように試すことができます

<Select
  selectedIndex={selectedIndex}
  status="basic"
  size="large"
  value={data[selectedIndex.row]?.name}
  onSelect={(index) => {
    setSelectedIndex(index);
  }}
>
  {data.map((item, i) => (
    <SelectItem title={item.name} />
  ))}
</Select>;

注: 使用する場合は、レンダリングする要素のラベルまたはリストを配列としてmultiSelect={true}提供する必要があります。value={[]}

于 2021-04-09T11:45:34.850 に答える