Реагировать на набор массива автозаполнения в текстовое поле

avatar
C Sharper
9 августа 2021 в 00:30
163
2
0

Я реализую функцию автозаполнения в реакции с приведенным ниже набором кода -

import axios from 'axios';
import React,{useState,useEffect} from 'react'
import TextInput from 'react-autocomplete-input';
import 'react-autocomplete-input/dist/bundle.css';
import { useDispatch } from 'react-redux'
import {SetProductList} from '../Redux/Actions/Actions'

function MainPage() 
{
    const iProductsList=[];
    const [productsList, setProductList] = useState(iProductsList)
    const dispatch = useDispatch()
    useEffect(() => {
        axios.get(`https://localhost:44301/api/login/GetProductList`)
        .then(res=>{ 
          console.log(JSON.stringify(res.data));
          alert(JSON.stringify(res.data));
          setProductList({           
           productsList:res.data
         });
           dispatch(SetProductList(res.data));
           console.log(productsList);
        });
    }, [])

    return (
        <div>
           <TextInput trigger="" options={{productsList}} />
        </div>
    )
}

export default MainPage

В этом коде, когда я поместил пользовательский список, я обнаружил, что он работает -

<TextInput trigger="" options={[some element1,some element2,some element3,some element4]} />

Но когда я назначаю состояние параметрам, это не работает. Я убедился, что мое состояние содержит в себе необходимый набор элементов массива -

enter image description here

В чем может быть причина / как мне изменить код для работы автозаполнения с -

<TextInput trigger="" options={{productsList}} />
Источник

Ответы (2)

avatar
Sean W
9 августа 2021 в 01:00
1

Вы передаете объект с массивом — вы должны передать стандартный массив или массив объектов.

<TextInput trigger="" options={productsList} />
avatar
C Sharper
10 августа 2021 в 00:18
0

После выполнения - productsList.productsList я получил рабочий результат.

<TextInput trigger="" options={productsList.productsList} />