浅谈vue获得后台数据无法显示到table上面的坑

作者:顾南与歌 时间:2024-05-13 09:07:16 

因为刚学vue然后自己自习了一下axios,然后想写一个简单的查询后台数据


<tr v-for=" user in uList">
       <td>{{user.id}}</td>
       <td>{{user.name}}</td>
       <td>{{user.gender}}</td>
       </td>
</tr>

然后先是写了这样一个代码


created: function () {    
     axios.get("http://localhost:8080/student/findAll").then(function (response) {
      this.uList = response.data;
       console.log(uList);
     }).catch(function (reason) {

})
   }

然后后台可以获取到数据,但是无法显示到table上面

发现this.uList虽然改变的数据但是数据无法显示到table上面

然后发现这里的this不是外部的this对象,然后进行了更改,数据就回显了


new Vue({
   el:'#app',
   data:{
     uList:[],
   },
   created: function () {
     var arr = this;
     axios.get("http://localhost:8080/student/findAll").then(function (response) {
       arr.uList = response.data;
       console.log(uList);
     }).catch(function (reason) {

})
   }
})

补充知识:vue data有值,但是页面{{}} 取不到值

我的问题出在js引入的顺序不对,导致不能正常显示vue中的值

正确的顺序应该是:

先引入vue的js--------html代码-----最后引入自己写的js

来源:https://blog.csdn.net/qq_40421610/article/details/83587591

标签:vue,后台,数据,table
0
投稿

猜你喜欢

  • CentOS7安装MySQL8的超级详细教程(无坑!)

    2024-01-25 13:25:41
  • MySQL分页Limit的优化过程实战

    2024-01-25 12:16:58
  • golang flag简单用法

    2024-05-08 10:23:48
  • JavaScript实现大文件上传的示例代码

    2024-05-28 15:40:23
  • 使用perl实现拆分数据表(mysql)并迁移数据实例

    2022-10-07 04:12:20
  • 通过不同的CSS设计字体大小来提高用户体验

    2008-12-10 19:17:00
  • Python3直接爬取图片URL并保存示例

    2022-10-31 17:30:40
  • python 将日期戳(五位数时间)转换为标准时间

    2021-09-14 06:36:47
  • 兼容Firefox的点击复制js代码

    2008-08-28 12:17:00
  • python数组循环处理方法

    2023-08-03 16:36:19
  • 基于Python Dash库制作酷炫的可视化大屏

    2022-09-13 14:20:32
  • Python实现识别图像中人物的示例代码

    2023-11-10 01:59:19
  • 如何获取当前 select 元素的值

    2010-03-29 13:07:00
  • python政策网字体反爬实例(附完整代码)

    2021-04-27 19:51:32
  • 装载iframe 子页面,自适应高度

    2008-11-20 12:53:00
  • js的压缩及jquery压缩探讨(提高页面加载性能/保护劳动成果)

    2024-04-16 09:23:41
  • 教你使用TensorFlow2识别验证码

    2022-06-26 19:24:38
  • js实现做通讯录的索引滑动显示效果和滑动显示锚点效果

    2024-04-16 09:23:00
  • 如何用变量实现群聊和悄悄话?

    2010-05-19 21:33:00
  • 多按钮共存——don’t make me think

    2010-01-11 20:20:00
  • asp之家 网络编程 m.aspxhome.com