手机版

在vue中读取本地Json文件的方法

时间:2021-08-30 来源:互联网 编辑:宝哥软件园 浏览:

其实网上可以找到一些方法,但是基本上没有完整的,或者说里面有些坑。让我们写下我自己的亲身经历。

要用vue读取本地json文件,需要安装vue-resource插件,然后使用它的$http.get读取json文件。

Json文件应该放在静态目录中

然后使用npm安装命令安装vue-resource。如果太慢,用淘宝镜像安装。安装后,请首先参考该组件。

在main.js文件中添加:

从“vue-resource”导入vue资源,然后:

Vue.use(VueResource)最后读取json数据:

这个。$ http . get(' static/map/China . JSON ')。然后(res={console.log ('json数据为:' res.body)//这里的res对象包含json的文件信息和数据,我们需要的json数据存在body属性中})这样我们就可以读取json数据了!

以上在vue中读取本地Json文件的方法是边肖与大家分享的全部内容。希望能给大家一个参考,支持我们。

版权声明:在vue中读取本地Json文件的方法是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。