怎么在vue组件里引用json文件里的数据

怎么在vue组件里引用json文件的数据

很简单,代码如下

先看JSON文件中的数据长这个样子

{
	"status": 200,
	"errno": 200,
	"msg": "获取分类指标Tree成功",
	"data": [
		{
			"id": 101,
			"pId": 1,
			"status": 1,
			"label": "经济",
			"ancestors": "0,1",
			"children": [
				{
					"id": 1101,
					"pId": 101,
					"status": 1,
					"label": "GDP",
					"ancestors": "0,1,101",
					"children": []
				},
				{
					"id": 1102,
					"pId": 101,
					"status": 1,
					"label": "行业增加值",
					"ancestors": "0,1,101",
					"children": []
				}
			]
		},
		{
			"id": 102,
			"pId": 1,
			"status": 1,
			"label": "面积",
			"ancestors": "0,1",
			"children": [
				{
					"id": 1201,
					"pId": 102,
					"status": 1,
					"label": "面积",
					"ancestors": "0,1,102",
					"children": []
				}
			]
		},
	]
}
**//直接在.vue文件里import导入要使用的json文件,命名为testData**
import testData from "../../assets/json/selectStatisticalCategoryIndexTree.json"

data() { 
	//定义一个data,必须赋初始值,否则报错
    const data = [];
    return { 
      data,
      defaultProps: { 
        children: "children",
        label: "label",
      },
    };
  },

  created(){ 
  	//修改的data值为JSON文件中想要的数据
    this.data = testData.data;
  },

这就行了,哈哈哈哈。有更好的方法,也希望大家能告诉我

    原文作者:一个可爱的名字丫
    原文地址: https://blog.csdn.net/weixin_44229267/article/details/112540112
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞