Vuejs不能引用数组

Question

我无法在vue js中引用数组。

  console.log(this.ref_number_response[0]);

这显示我未定义，我想知道为什么......

      data(){
        return{ 
           ref_number_response: [],
     }
},
methods:{
check_ref_number: function () {
             // axios request
             axios.get('/is_referenceNumber_free/'+this.ref_number)
             .then(response => this.ref_number_response.push({ 
                 info: response.data

              }));

        
console.log(this.ref_number_response[0]);
           Event.$emit('reference_added', this.ref_number_response);
             
         },
}

<div class="form-group">
        <label for="" class="col-sm-2 control-label">Ref Number</label>
        <div class="col-sm-10">
            <input v-model="ref_number" type="text" name="ref_number" class="form-control" id="" placeholder="Referent number" @blur="check_ref_number" required>
        </div>
    </div>

这是我得到的响应，我不想使用v-for进行几次实际诊断。

[{“info”：[{“诊断”：“St. post。创伤睾丸罪.Obs Ruptura睾丸罪。” }，{“诊断”：“diagnosi2”}]}]

Answer 1

它显示未定义，因为console.log在promise之外。当你控制日志时，ref_number_response是一个空数组，第一个元素显然是未定义的。

data(){
     return { 
           ref_number_response: [],
     };
},
methods: {
   check_ref_number() {
             // axios request
             axios.get('/is_referenceNumber_free/'+this.ref_number)
             .then((response) => {
                  console.log(response.data);
                  this.ref_number_response = response.data;
                  console.log(this.ref_number_response); // now its not empty
                  this.$emit('reference_added', this.ref_number_response);
             });
         },
}