React js控制台数组元素未定义

React js console array element undefind

我试着打印这个

console.log(location_list.all_list[3]);
console.log(location_list.all_list);

但有 1 例 "undefined"。 哪里不对?

更多代码:

    var items = [];
    
    $.getJSON( "js/location_list.json", function( data ) {
        $.each( data, function( key, val ) {
            items.push(key=val);
        });
    });
    
    this.all_list = items;

结论: 此类赋值不能用于 "getJSON"

this.all_list = items;

基于此代码:

    var items = [];
    $.getJSON( "js/location_list.json", function( data ) {
        $.each( data, function( key, val ) {
            items.push(key=val);
        });
    });
    this.all_list = items;

看起来是因为异步

检索事件中的语句

$.each( data, function( key, val ) {
    items.push(key=val);
});

您在检索事件发生前调用 console.log(location_list.all_list[3]);

console.log(location_list.all_list); => []
console.log(location_list.all_list[3]); => 'undefined'

您需要检查 all_list

的长度
if(location_list.all_list.length > 3) console.log(location_list.all_list[3]);

我给你出主意

使用回调技术

更改 list_load 的定义,添加 cb

list_load : function(cb){
    var self = this;
    self.all_list = [];
    $.getJSON( "js/location_list.json", function( data ) {
        $.each( data, function( key, val ) {
            self.all_list.push(key=val);
        });
        cb()
    });
},

然后

location_list.list_load(function(){
    console.log(location_list.all_list[3]);
    console.log(location_list.all_list);
    console.log(typeof location_list);
});