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

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

一、通过网络请求导入

步骤:

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

2.

在此注册json文件

3.

找到devServer方法,在里面 声明访问的方法和路径

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)

    },

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Vue.js工程化项目起步——vue-router-demo: 本例主要采用vue-cli配合webpack来创建...
    诅咒猎豹阅读 1,449评论 0 0
  • 前端项目打包部署 通过vue-cli和webpack构建的项目体积一般都较大,在生产环境下,需要进行打包部署。 1...
    诅咒猎豹阅读 1,937评论 0 0
  • Spring Boot文件上传 文件上传是项目开发中的常见操作。一般分为如下几种解决方案 直接上传到应用服务器 上...
    诅咒猎豹阅读 1,332评论 0 0
  • 一. 复习: 1.服务器的结构类型有哪些?简单说明答:机架式服务器、刀片式服务器、塔式服务器、云服务器 2.在32...
    杰S咪阅读 3,564评论 0 0
  • 随着技术的积淀,AI正在走出象牙塔和实验室,步入商业世界,成为撬动社会发展和经济增长的新杠杆。人工智能的发展为世界...
    Feather轻飞阅读 2,755评论 0 0