这是第二次在项目中遇到此问题,ajax请求成功后在success函数中为Vue实例data里的变量赋值,却失败了

new Vue({
el:'#app',
data:{
msg:''
},
created:function(){
$.ajax({
url:'',
data:'',
dataType:'json',
success:function(res){
this.msg = res.data;
}
})
}
})

原因在于在ajax的success函数中,this的指向不再是vue的实例

解决办法可以先把this保存起来

new Vue({
el:'#app',
data:{
msg:''
},
created:function(){
var that = this;
$.ajax({
url:'',
data:'',
dataType:'json',
success:function(res){
that.msg = res.data;
}
})
}
})

也可以将vue实例赋值给变量,再通过变量来访问其数据,实例化后window里会有vm实例对象,底层会把data里的属性挂载到vm实例对象上作为vm的属性

var vm = new Vue({
el:'#app',
data:{
msg:''
},
created:function(){
$.ajax({
url:'',
data:'',
dataType:'json',
success:function(res){
vm.msg = res.data;
}
})
}
})

参考资料

Vue中ajax赋值问题

最新文章

  1. js打开没有地址栏下拉条新窗口
  2. MyBatis 注解使用动态SQL
  3. WPF ListView DoubleClick
  4. Windows 下的.NET+ Memcached安装
  5. ServiceStack.OrmLite 6 学习笔记 查
  6. Java SE ---关系运算符
  7. (转)Hprose与WCF在云计算平台Azure上的对决
  8. 5.7.2.1 Math对象
  9. hibernate 和 jdbc 优缺点对比
  10. js 移动端识别手机号码
  11. ubuntu14.04上实现faster rcnn_TF的demo程序及训练过程
  12. java 函数初始化作用
  13. Java——容器类库框架浅析
  14. 为什么String被设计为不可变?是否真的不可变?
  15. snmp模拟器snmpsid使用
  16. 使用git和github进行协同开发流程
  17. 【2016.3.16】作业 VS2015安装&单元测试(1)
  18. dos与unix系统的格式转化
  19. 使用 BEGINCONTENT() 和 ENDCONTENT() 设定 YII 的 LAYOUTS
  20. SQL Server表描述 及 字段描述的增、删、改、查询

热门文章

  1. php框架之thinkphp
  2. Centos7下安装和配置vim
  3. Ubuntu系统桌面任务栏和启动器全部消失解决方案
  4. MonkeyRunner API简介
  5. bugku web 头等舱
  6. 前端动态菜单-bootstrap-treeview
  7. .Net Core 环境下构建强大且易用的规则引擎
  8. [CQOI2009] 中位数
  9. OMS自动化运维平台部署
  10. Mac下查看node等的安装路径