详解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 相关文章推荐
jquery下为Event handler传递动态参数的代码
Jan 06 Javascript
使用JQuery和CSS模拟超链接的用户单击事件的实现代码
May 23 Javascript
javascript如何判断输入的url是否正确
Apr 11 Javascript
Visual Studio中js调试的方法图解
Jun 30 Javascript
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
May 01 jQuery
使用 Vue.js 仿百度搜索框的实例代码
May 09 Javascript
详解在vue-cli项目中使用mockjs(请求数据删除数据)
Oct 23 Javascript
详解Vue取消eslint语法限制
Aug 04 Javascript
微信小程序 网络通信实现详解
Jul 23 Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
Sep 12 Javascript
vue滚动插件better-scroll使用详解
Oct 18 Javascript
Vue3.0的优化总结
Oct 16 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
简单的页面缓冲技术
2006/10/09 PHP
使用PHP导出Word文档的原理和实例
2013/10/21 PHP
Yii操作数据库的3种方法
2014/03/11 PHP
PHP面向对象程序设计方法实例详解
2016/12/24 PHP
PHP使用Nginx实现反向代理
2017/09/20 PHP
Date对象格式化函数代码
2010/07/17 Javascript
JS复制到剪贴板示例代码
2013/10/30 Javascript
js实现连个数字相加而不是拼接的方法
2014/02/23 Javascript
微信小程序动态添加分享数据
2017/06/14 Javascript
vue-cli项目如何使用vue-resource获取本地的json数据(模拟服务端返回数据)
2017/08/04 Javascript
jQuery完成表单验证的实例代码(纯代码)
2017/09/30 jQuery
浅谈Vue.nextTick 的实现方法
2017/10/25 Javascript
JS实现利用两个队列表示一个栈的方法
2017/12/13 Javascript
详解plotly.js 绘图库入门使用教程
2018/02/23 Javascript
node基于async/await对mysql进行封装
2019/06/20 Javascript
webpack4 配置 ssr 环境遇到“document is not defined”
2019/10/24 Javascript
jQuery实现简单聊天室
2020/02/08 jQuery
vue 根据选择的月份动态展示日期对应的星期几
2021/02/06 Vue.js
python使用append合并两个数组的方法
2015/04/28 Python
深入理解Python中变量赋值的问题
2017/01/12 Python
Python实现的拟合二元一次函数功能示例【基于scipy模块】
2018/05/15 Python
Python过滤txt文件内重复内容的方法
2018/10/21 Python
python由已知数组快速生成新数组的方法
2020/04/08 Python
浅谈TensorFlow中读取图像数据的三种方式
2020/06/30 Python
Django前后端分离csrf token获取方式
2020/12/25 Python
HTML5使用Audio标签实现歌词同步的效果
2016/03/17 HTML / CSS
德国原装品牌香水、化妆品和手表网站:BRASTY.DE
2016/10/16 全球购物
同程旅游英文网站:LY.com
2018/11/13 全球购物
音乐器材管理制度
2014/01/31 职场文书
面试后感谢信
2014/02/01 职场文书
学生个人自我鉴定
2014/03/26 职场文书
建筑管理专业求职信
2014/07/28 职场文书
杭州黄龙洞导游词
2015/02/10 职场文书
为什么MySQL 删除表数据 磁盘空间还一直被占用
2021/10/16 MySQL
Java8 Stream API 提供了一种高效且易于使用的处理数据的方式
2022/04/13 Java/Android
MySQL中TIMESTAMP类型返回日期时间数据中带有T的解决
2022/12/24 MySQL