vue.js实现数据库的JSON数据输出渲染到html页面功能示例

本文实例讲述了vue.js实现数据库的JSON数据输出渲染到html页面功能。分享给大家供大家参考，具体如下：

1、首先通过json.php把数据库给输出为json格式的数据

[
  {
    "id":1,
    "resname":"百度",
    "resimg":"http://www.baidu.com/1.jpg",
    "resint":"2018-1-18",
    "resurl":"http://www.baidu.com/1.apk",
    "pageview":"100"
  },
  {
    "id":2,
    "resname":"阿里巴巴",
    "resimg":"http://www.alibaba.com/1.jpg",
    "resint":"2018-1-18",
    "resurl":"http://www.alibaba.com/1.apk",
    "pageview":"200"
  },
  {
    "id":3,
    "resname":"腾讯",
    "resimg":"http://www.qq.com/1.jpg",
    "resint":"2018-1-18",
    "resurl":"http://www.qq.com/1.apk",
    "pageview":"300"
  }
]

然后通过vue.js来解析

  
  
  
  
  


  
    

      

 
ID
 
资源名称
 
LOGO
 
更新时间
 
下载地址
 
阅读量
      
      

 
{{r.id}}
 
{{r.resname}}
 

 
{{r.resint}}
 
点击下载
 
{{r.pageview}}
      
    
  

最终运行index.html

希望本文所述对大家vue.js程序设计有所帮助。