Блог

Я очень новичок в использовании 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)
        
        
        
            }
  

Проблема, с которой я сталкиваюсь, заключается в том, что иногда, когда я обновляю веб-страницу и пытаюсь выбрать из выпадающего списка, параметры отображаются как «Без параметров» / none. Я думаю, поскольку вызов конфигурации, который я выполняю внутри моей функции componentDidMount, является асинхронным, это вызывает проблемы, когда для загрузки результатов требуется время. Я добавил некоторую консоль.инструкции журнала, но, согласно наблюдению, если я обновлю страницу и попытаюсь сразу выбрать параметры из выпадающего списка, они не отображаются. Но я вижу, что мой цикл for выполняется, и в options действительно есть элементы. Но консоль.инструкция журнала для «myoptions» не печатается.Прикрепляю скриншот для справки. Мы высоко ценим любые предложения по решению этой проблемы.