当前位置: 首页 > article >正文

vue-cli引入本地json数据:封装为js文件,无需请求直接读取

vue-cli引入本地json数据

1、新建js文件(路径自定义),写入JSON数据

/* jsonData.js */

export let jsonData = {  // 声明变量,存储数据
  // JSON源数据
}

2、组件内引入js文件,读取数据

/* Example.vue */

import { jsonData } from '/jsonData.js'  // 引入js文件中的变量(注意文件路径)
export default {
  data() {
    return {
      data: jsonData  // 读取数据(引入完毕)
    }
  },
  created() {
    console.log(this.data)  // 可进行其他操作
  }
}

http://www.kler.cn/news/233419.html

相关文章:

  • c++学习:命名空间
  • C++ 中的模型预测控制(01/2)
  • python 动态数据 展示 ,数据是由51单片机发送过来的,温度传感器。
  • 【QT+QGIS跨平台编译】之三十二:【MiniZip+Qt跨平台编译】(一套代码、一套框架,跨平台编译)
  • 【前后端接口AES+RSA混合加解密详解(vue+SpringBoot)附完整源码】
  • [软件工具]文档页数统计工具软件pdf统计页数word统计页数ppt统计页数图文打印店快速报价工具
  • K8S容器挂了后重启状态正常,但应用无法访问排查处理
  • TELNET 远程终端协议
  • “OLED屏幕,色彩绚丽,画面清晰,让每一帧都生动无比。“#IIC协议【上】
  • 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Slider组件
  • CentOS 7安装Nodejs
  • 微信小程序上传代码教程
  • 2024/2最新升级ChatGPT Plus的方法
  • 堆排序----C语言数据结构
  • 股票均线的使用方法和实战技术,看涨看空的均线形态与案例教学
  • VisaulStudio2022下用VB.net实现socket与西门子PLC进行通讯案例(优化版)
  • QT初始程序
  • 设计模式-建造者模式Builder
  • uniapp的配置和使用
  • 【C语言】变量与常量
  • 【Qt】常见问题
  • 2.7日学习打卡----初学RabbitMQ(二)
  • springboot173疫苗发布和接种预约系统
  • 3 scala集合-Set
  • 面试经典150题 -- 栈(总结)
  • vue3+vite+ts 配置commit强制码提交规范配置 commitlint
  • 力扣刷题之旅:进阶篇(三)
  • Java异常的处理 try-catch-finally
  • Python 字符串模块
  • “OLED屏幕,色彩绚丽,画面清晰,让每一帧都生动无比。“#IIC协议【下】