Question

我正在使用异步React-Select来获取一些值，问题是我收到了数据，可以对其进行过滤，但结果不会出现在建议框中。

我尝试了不同的方法，使用了一个没有过滤器的函数，我什至尝试复制一些我在另一个应用程序中编写的代码，但运气不好。

这是我用于获取数据的代码：

getBusinesses = (input) => {
        axios.get(API.GET_BUSINESSES_USERS, {
            params: {
                token: this.props.token
            }
        }).then((response) => {
            const options = response.data.businesses.map(business => ({ label: business.email, value: business.id }));
            this.setState({
                options
            })
            new Promise(resolve => {
                console.log(this.filterOptions(input))
                resolve(this.filterOptions(input))
            })
        }).catch((err) => {
            console.log(err);
        })
    }

这是过滤数据的方法：

    filterOptions = (inputValue) => {
        return this.state.options.filter(i =>
            i.label.toLowerCase().includes(inputValue.toLowerCase())
        );
    };

这就是我创建异步组件的方式：

 <Async
   name="form-field-name"
   loadOptions={this.getBusinesses}
   loadingPlaceholder="Cargando..."
   placeholder="Carrera..."
   autoBlur={true}
   clearable={false}
/>

Answer 1

如documentation中所述，将loadOptions道具与承诺一起使用时，您需要返回承诺，以便可以从已解决的结果中加载选项。

只需在您的return调用之前添加axios.get，或在{}函数中将()更改为getBusinesses，以使axios调用函数的返回值。

希望这会有所帮助。

异步React Select不会向我显示建议

1 个答案: