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

 更新时间:2017年07月06日 14:28:42   作者:joe_dev  
这篇文章主要介绍了详解vue渲染从后台获取的json数据,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

公司项目原来用的框架扩展性太差,准备更新前台页面然后用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的时候就不行。

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

相关文章

  • vue+ts实现元素鼠标拖动效果

    vue+ts实现元素鼠标拖动效果

    这篇文章主要为大家详细介绍了vue+ts实现元素鼠标拖动效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-11-11
  • vue中使用props传值的方法

    vue中使用props传值的方法

    这篇文章主要介绍了vue中使用props传值的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05
  • typescript中this报错的解决

    typescript中this报错的解决

    这篇文章主要介绍了typescript中this报错的解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • vue+vite+diff.js使用小结

    vue+vite+diff.js使用小结

    本文主要介绍了vue+vite+diff.js使用小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-12-12
  • vue中引入mousewheel事件及兼容性处理方式

    vue中引入mousewheel事件及兼容性处理方式

    这篇文章主要介绍了vue中引入mousewheel事件及兼容性处理方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-03-03
  • 解析VUE中nextTick是什么

    解析VUE中nextTick是什么

    nextTick是Vue提供的一个全局API,由于Vue的异步更新策略导致我们对数据的修改不会立刻体现,在DOM变化上,此时如果想要立即获取更新后的DOM状态,就需要使用这个方法,这篇文章主要介绍了解析VUE中nextTick,需要的朋友可以参考下
    2022-11-11
  • element表格行列拖拽的实现示例

    element表格行列拖拽的实现示例

    本文主要介绍了element表格行列拖拽的实现示例,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-10-10
  • vue项目因内存溢出启动报错的解决方案

    vue项目因内存溢出启动报错的解决方案

    这篇文章主要介绍了vue项目因内存溢出启动报错的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-09-09
  • Vue与Nuxt的区别及使用说明

    Vue与Nuxt的区别及使用说明

    这篇文章主要介绍了Vue与Nuxt的区别及使用说明,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2025-04-04
  • vue实现百度语音合成的实例讲解

    vue实现百度语音合成的实例讲解

    在本篇文章里小编给大家整理的是关于vue实现百度语音合成的实例内容,以及相关代码,需要的朋友们参考下。
    2019-10-10

最新评论