h5引入json_Vue中如何使用本地Json文件？
生活随笔
收集整理的這篇文章主要介紹了
h5引入json_Vue中如何使用本地Json文件？
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
我需要將菜單配置成Json文件，然后再程序中引入
{{menu.name}}
import menuListConfig from '../../config/menu.json'
export default {
name: "Sider",
data(){
return {
menuList:JSON.parse(JSON.stringify(menuListConfig))
}
}
}
需要如何做，才能v-for遍歷jsoｎ文件？謝謝
回答
webpack配置項增加json解析插件，并安裝：
npm i json-loader -d //先裝插件
修改webpack配置
//webpack.config.js
module:{
rules:[{
test: /\.json$/,
loader: 'json-loader',
}],
}
//或者vue.config.js
configureWebpack: {
module:{
rules:[{
test: /\.json$/,
loader: 'json-loader',
}],
}
}
即便如此，還是先看看解析結果是啥再說：
import最好是加載js文件，條件允許還是不要用json文件，錯誤率會低一些，應為json文件的格式要求很高。
總結
以上是生活随笔為你收集整理的h5引入json_Vue中如何使用本地Json文件？的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： uniapp接收服务器消息,【教程】un
- 下一篇： html5倒计时秒杀怎么做,vue 设