关于vue.js:Axios在vue组件变量中设置响应数据,但变量未在浏览器上显示数据

Axios setting response data in vue component variable but variable not displaying data on browser

Axios在Vue组件变量中设置响应数据,但该变量未在浏览器上显示数据。 我们可以在控制台上看到数据,但是当我显示时,浏览器什么都没显示。 数据采用JSON格式。

快照:

Snapshot of the code

输出:

Output

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
  <template>

           
                Subject
               
                    <!-- <ul class="list-group">
                        <li class="list-group-item" :key ="message.id" v-for ="message in messages"> {{ message.subject}}
</li>

                   
</ul>
 -->
                    {{messages}}
               
             

</template>

export default{
  name: 'subject-component',
    data () {
    return {
     messages:{}
    }  
  },
  mounted () {

  },
    created(){

         axios.get('http://127.0.0.1:8000/subject/get')
          .then(response => {this.messages = response.data})
          .catch((error) => console.log(error));

    }
}


通过重新设置项目,此问题已解决。 再一次,我对axios请求使用了相同的方法。

axios.get('http://127.0.0.1:8000/get/subjects')
.then((response)=>(this.subjects = response.data))
.catch(function(error){console.log(error)});

谢谢大家的努力。