微服务静态页面开发规范

在项目开发的过程中，为了方便快速地修改页面静态部分，页面将引入json文件以添加数据。以下为引入本地json文件操作步骤。

---

address.json 

{
  "status":0,
  "message":"",
  "result":[
    {
      "addressId":"100001",
      "userName":"JackBean",
      "streetName":"北京市朝阳区朝阳公园1",
      "postCode":"100001",
      "tel":"12345678901",
      "isDefault":true
    },
    {
      "addressId":"100002",
      "userName":"JackBean",
      "streetName":"北京市朝阳区朝阳公园2",
      "postCode":"100001",
      "tel":"12345678901",
      "isDefault":false
    }
  ]
}

• 将本地json文件放在static统计目录下，这样引用的地址也会和图片引用地址一致 

   

• 在所需引用的vue页面引入

import axios from 'axios'

• 在调用的.vue页面引入

mounted () {
    console.log(1)
    axios.get('static/mailbox/address.json').then((res) => {
      // 响应成功回调
      console.log(res.data)
      }, (response) => {
      // 响应错误回调
      console.log('服务器请求失败')
      })
  }

 贴上数据读取的打印结果

​​​​​​