使用react-select

问题描述

我对使用React非常陌生。我正在使用react-select提供下拉菜单,并尝试动态设置下拉菜单的选项。这是我在做什么:-

constructor(props) {
        super(props);
        this.printlist = this.printlist.bind(this);
        this.state = {
            checked: false,values: [],mylist: [],myoptions:[]
        };
    }

     componentDidMount() {
            console.log("inside component did mount")
         
    
            var configservice = new AWS.ConfigService(); 
            var params = {
                ConfigurationAggregatorNames: [
                    'Proserve'
                ]
            };
    
    // I make a AWS config call to get the items for myoptions list as follows
    
    
        configservice.describeConfigurationAggregators(params,function(err,data) {
                    if (err) console.log(err,err.stack); // an error occurred
                    else {
                        console.log("accounts in config call: ",data.ConfigurationAggregators[0].AccountAggregationSources[0].AccountIds);
        
                        accounts = data.ConfigurationAggregators[0].AccountAggregationSources[0].AccountIds
                        console.log("accounts are: ",accounts)
                        var a;
                        for (a = 0; a < accounts.length; a++) { 
                            console.log("inside for loop")
                            var oj = { label: "",value: 0 }
                            oj.label = (accounts[a])
                            oj.value = accounts[a]
                            options.push(oj) //construct an array of objects
                        }
        
                       console.log("options are: ",options)
        
                    } // successful response
                });
        
                this.setState({myoptions:options})
                console.log("myoptions are: ",this.state.myoptions)
        
        
        
            }

我面临的问题有时是当我刷新网页并尝试从下拉菜单中选择时,这些选项以“无选项” /无显示。我认为由于我在componentDidMount函数内部进行的配置调用是异步的,因此在加载结果花费时间时会导致问题。我添加了一些console.log语句,但是根据观察,如果刷新页面并尝试立即从下拉列表中选择选项,它将显示None。但是我看到我的for循环已执行,并且选项中确实有项目。。但是“ myoptions”的console.log语句未打印。附加了屏幕快照以供参考。任何解决此问题的建议都将受到赞赏。

Browser dev console and drop down menu

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)