码迷,mamicode.com
首页 > Web开发 > 详细

vue使用json最简单的两种方式

时间:2020-02-01 14:13:53      阅读:508      评论:0      收藏:0      [点我收藏+]

标签:最简   axios   res   port   方式   数据   import   ons   from   

第一种:

首先我项目是在 webpack 下搭建的vue项目
在public文件夹下创建jsonTest.json
json 格式的数据如下:
{
    “innerList”: [
        {"attr1":"内部数据1","attr2":"内部数据2",...},
        {"attr1":"内部数据1","attr2":"内部数据2",...},
        ....
    ]
}
在某一组件内:

......html元素
import people from '../../json/jsonTest.json';
 
export default{
    data(){
        return {
            dataset: people.innerList
        }
    }
}

第二种:

getDataList(){
 this.$axios.get("/json/jsonTest.json").then((res)=>{
 //得到response.data数据做具体赋值操作
 }).catch(() => {
        response.errer
                    this.$message({
                        message: response.errer.msg
                    })
                })
 

vue使用json最简单的两种方式

标签:最简   axios   res   port   方式   数据   import   ons   from   

原文地址:https://www.cnblogs.com/demiao/p/12248315.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!