Vue.js更新Data屬性變量中的Ajax數據

Question

我是Vue.js的新手。 我想從ajax數據更新數據。

<template>
  <span class="label_cont">This is to certify that</span> {{ name }}
</template>

我想從ajax數據中{{ name }}變量。
這是我的js代碼

export default{
  created(){
    const url = 'app/result.php';
    this.$http.get(url).then(response => {
      this.resp = response.body;
    });
  },
  data(){  
    return {
     resp:[],
     name: resp.name,
   }
  }
}

在我的ajax name屬性位於this.resp.name

更新：

這是我的ajax響應數據格式

{
  "name": "X",
  "class": "Y",
  "roll": "Z"
}

Answer 1

在下面的回調中添加額外的行。

this.$http.get(url).then(response => {
  this.resp = response.body;
  this.name = response.name
});

在您的數據中，只需將其初始化為null。

data(){  
  return {
    resp:[],
    name: null,
  }
}

或者，您可以只使用

{{resp.name}}

在您的模板中。