vue项目导入本地json文件的方法

vue项目导入本地json文件的2种方法

一、通过网络请求导入

步骤：

1.找到vue项目目录下的build/webpack.dev.conf.js文件

2.

3.

4.在页面钩子函数触发时，调用

created() {

        this.$http.get('/api/customs_cut_mode').then((response) =>{

          response = response.body

          if (response.errno == ERR_OK||response.errno ==0) {

            this.customs_cut_mode= response.data

          }

        })

      }

二、通过ES6导入本地json

1.将json数据放入指定目录。

2.在页面引入

import   customs_cut_mode   from '../../common/Alljson/customs_cut_mode.json'

3.页面使用

mounted() {

      this.customs_cut_mode= customs_cut_mode

      // console.log( this.customs_cut_mode)

    },

json 是个字符串  要添加属性 必须先转换为  对象 或者数组

// 题主说 添加属性 那这个json 应该是一个 对象json   

var JsonString = '{"age":1,"name":"tom"}'

// 先要把json 转化为对象

var jsonObj = JSON.parse(JsonString)

// 然后在该对象中添加一个 sex 字段

jsonObj["sex"] = "男"  // 或者  jsonObj.sex = "男"  (如果你添加的字段中有 . - 等特殊字符)，就只能使用第一种

// 如果你要使用 直接使用jsonObj 就可以 如果还要转化回去 使用 JSON.prase()方法

JsonString = JSON.prase(jsonObj)

---