详解vue渲染从后台获取的json数据


Posted in Javascript onJuly 06, 2017

公司项目原来用的框架扩展性太差,准备更新前台页面然后用vue渲染dom

然后我写了一个demo

$(document).ready(function(){
   $.ajax({
    type:"post",    
    url:"",
    async:true,
    data:{
    },
    dataType:"json",
    success:function(data){
     var a=new Vue({
      el:"#detail-info-id",
      data:{
      data:[
  {
  "企业名称":"aaaaaaaaaaa","企业组织机构代码":"bbbbbbbbbbbbbbbb",
    
 "上级单位":"cccccccccc","集团或者管理部门":"dddddddddddddd"
 }
   ]}
     })
    },
    error:function(data){
     console.log("error")
    }
   });
  });

因为想着只是一个demo,在交给其他同事在运用到项目的时候肯定会更改key和value,所以就直接拿汉字作为key了,并且可以渲染成功,因为渲染成功了,所以没多想,然而在实际项目运用的过程中console却报了各种奇怪的错误,找不到id啊什么。。当时真是一头雾水。最后把key换成英文就可以渲染成功了。。

但是为什么在data把数据写死,就可以渲染成功,不管key是英文还是汉字,但在项目中从后台获取json的时候就不行。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
按钮JS复制文本框和表格的代码
Apr 01 Javascript
鼠标经过tr时,改变tr当前背景颜色
Jan 13 Javascript
用js判断是否为360浏览器的实现代码
Jan 15 Javascript
JavaScript编写Chrome扩展实现与浏览器的交互及时间通知
May 16 Javascript
javascript轮播图算法
Oct 21 Javascript
BootStrap Fileinput插件和Bootstrap table表格插件相结合实现文件上传、预览、提交的导入Excel数据操作步骤
Aug 07 Javascript
在小程序中使用Echart图表的示例代码
Aug 02 Javascript
JS实现网页端猜数字小游戏
Mar 06 Javascript
微信公众号中的JSSDK接入及invalid signature等常见错误问题分析(全面解析)
Apr 11 Javascript
JavaScript 面向对象程序设计详解【类的创建、实例对象、构造函数、原型等】
May 12 Javascript
vue cli 3.0通用打包配置代码,不分一二级目录
Sep 02 Javascript
vant-ui AddressEdit地址编辑和van-area的用法说明
Nov 03 Javascript
微信小程序 Buffer缓冲区的详解
Jul 06 #Javascript
VUE axios发送跨域请求需要注意的问题
Jul 06 #Javascript
vue-cli如何添加less 以及sass
Jul 06 #Javascript
微信小程序 跳转传递数据的实例
Jul 06 #Javascript
详解webpack进阶之插件篇
Jul 06 #Javascript
微信小程序 sha1 实现密码加密实例详解
Jul 06 #Javascript
AngularJS学习笔记之表单验证功能实例详解
Jul 06 #Javascript
You might like
《魔兽争霸3:重制版》更新 多项视觉效果调整
2020/05/04 魔兽争霸
[转帖]PHP世纪万年历
2006/12/06 PHP
解析:php调用MsSQL存储过程使用内置RETVAL获取过程中的return值
2013/07/03 PHP
ThinkPHP采用实现三级循环代码实例
2014/07/18 PHP
php使用parse_url和parse_str解析URL
2015/02/22 PHP
Windows7下的php环境配置教程
2015/02/28 PHP
PHP使用数组依次替换字符串中匹配项
2016/01/08 PHP
Yii2实现多域名跨域同步登录退出
2017/02/04 PHP
PHP判断访客是否手机端(移动端浏览器)访问的方法总结【4种方法】
2019/03/27 PHP
JQueryEasyUI Layout布局框架的使用
2013/04/08 Javascript
动态加载script文件的两种方法
2013/08/15 Javascript
通过pjax实现无刷新翻页(兼容新版jquery)
2014/01/31 Javascript
ANGULARJS中用NG-BIND指令实现单向绑定的例子
2014/12/08 Javascript
jQuery实现下拉框选择图片功能实例
2015/08/08 Javascript
JavaScript基础篇(3)之Object、Function等引用类型
2015/11/30 Javascript
jQuery通过写入cookie实现更换网页背景的方法
2016/04/15 Javascript
用JS实现图片轮播效果代码(一)
2016/06/26 Javascript
完美解决IE不支持Data.parse()的问题
2016/11/24 Javascript
Easyui Tree获取当前选择节点的所有顶级父节点
2017/02/14 Javascript
微信小程序实现点击返回顶层的方法
2017/07/12 Javascript
关于JavaScript中forEach和each用法浅析
2017/07/27 Javascript
微信小程序定位当前城市的方法
2018/07/19 Javascript
node学习笔记之读写文件与开启第一个web服务器操作示例
2019/05/29 Javascript
Vue的生命周期操作示例
2019/09/17 Javascript
基于vue 动态菜单 刷新空白问题的解决
2020/08/06 Javascript
js实现批量删除功能
2020/08/27 Javascript
Python实现的井字棋(Tic Tac Toe)游戏示例
2018/01/31 Python
Python3模拟curl发送post请求操作示例
2019/05/03 Python
python网络编程 使用UDP、TCP协议收发信息详解
2019/08/29 Python
python实现差分隐私Laplace机制详解
2019/11/25 Python
TFRecord格式存储数据与队列读取实例
2020/01/21 Python
清除canvas画布内容(点擦除+线擦除)
2020/08/12 HTML / CSS
意大利领先的线上奢侈品销售电商:Eleonora Bonucci
2017/10/17 全球购物
手工制作的音乐盒:Music Box Attic
2019/09/05 全球购物
2015年七夕爱情寄语
2015/03/24 职场文书
nginx服务器的下载安装与使用详解
2021/08/02 Servers