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

vue项目引入json/js文件批量或单个方法

vue项目

json

// 方式一 : 将文件内容完整的引入
import json from './src/assets/xxx.json'
console.log(json)
console.log('---')// 方式二 : 部分引入-名称必须是文件中定义的key
import {name1,name2} from './src/assets/xxx.json'
console.log(name1)
console.log(name2)

js

import '../xxxxx.js';
批量引入
//三级边框
let lnglatJson = loadFrames (require.context('../assets/js/lnglatJson', false, /\.js$/))/*** 批量加载js* @param {Function} context - require.context 创建的函数* @returns {Array<string>} 返回的所有js*/
function loadFrames (context) {const frames = {}context.keys().forEach(k => {if(k.includes('anyang')){frames['xx']=context(k)}else if(k.includes('hebi')){frames['xx']=context(k)}else if(k.includes('xinxiang')){frames['xxx']=context(k)}})return frames
}
export default {lnglatJson}

vite项目

json

//单个
import.meta.glob('./languages/**/*.json', {import: 'default',eager: true,})
//json导入
//批量
(async function(){let jsonFiles =await import.meta.globEager('../../../../public/js/map/json/*.json');console.log(jsonFiles)let jsonData={}for (let filePath in jsonFiles) {const fileData = jsonFiles[filePath].default;jsonData[filePath.replace(/.*\//, '')] = fileData; // 移除路径前缀}console.log(jsonData)
})()
//写在函数中
onMounted(async () => {let jsonFiles =await import.meta.globEager('../../../../public/js/map/json/*.json');console.log(jsonFiles)let jsonData={}for (let filePath in jsonFiles) {const fileData = jsonFiles[filePath].default;jsonData[filePath.replace(/.*\//, '')] = fileData; // 移除路径前缀}console.log(jsonData)
});

js

//js导入
import '../../../../public/js/map/yunnan.js';
//云南导入
const files = import.meta.globEager("../../../../public/js/map/yunnan/*")
let AllPics = Object.values(files).map((v) => v.default);

相关文章:

vue项目引入json/js文件批量或单个方法

vue项目 json // 方式一 &#xff1a; 将文件内容完整的引入 import json from ./src/assets/xxx.json console.log(json) console.log(---)// 方式二 &#xff1a; 部分引入-名称必须是文件中定义的key import {name1,name2} from ./src/assets/xxx.json console.log(name1)…...

守护任务用来防止资源冲突

背景&#xff1a;有三个任务&#xff0c;他们都需要操作数码管。每个任务对应三个数码管&#xff0c;共9个数码管。硬件上9个数码管的控制使用一套硬件完成。 策略&#xff1a;每个任务都往自己的队列里面发数据&#xff0c;单独建立一个监听任务&#xff1a;处理所有队列的数…...

fast admin实现多数据库导入数据

思路 1创建多数据库连接 2后端的前台代码能使用get或者post请求传递选中数据给后台 3后台能够接收到 4后台接收到id或者全字段数据后对数据进行处理&#xff0c;然后使用多数据库操作将其存入第二个数据库 实现 1config文件下创建新数据库连接 db_config2 > [// 数据库类…...

NLP基础——序列模型(动手学深度学习)

序列模型 定义 序列模型是自然语言处理&#xff08;NLP&#xff09;和机器学习领域中一类重要的模型&#xff0c;它们特别适合处理具有时间顺序或序列结构的数据&#xff0c;例如文本、语音信号或时间序列数据。 举个例子&#xff1a;一部电影的评分在不同时间段的评分可能是…...

机器学习AI大模型的开源与闭源:哪个更好?

文章目录 前言一、开源AI模型1.1 开源的优点1.2 开源的缺点 二、闭源AI模型2.1 闭源的优点2.2 闭源的缺点 三、开源与闭源的平衡3.1 开源与闭源结合的案例3.2 开源与闭源的战略选择 小结 前言 在过去的几年里&#xff0c;人工智能&#xff08;AI&#xff09;和机器学习&#xf…...

关于大模型多轮问答的两种方式

前言 大模型的多轮问答难点就是在于如何精确识别用户最新的提问的真实意图&#xff0c;而在常见的使用大模型进行多轮对话方式中&#xff0c;我接触到的只有两种方式&#xff1a; 一种是简单地直接使用 user 和 assistant 两个角色将一问一答的会话内容喂给大模型&#xff0c…...

达梦数据库相关SQL及适配Mysql配置总结

&#x1f353; 简介&#xff1a;java系列技术分享(&#x1f449;持续更新中…&#x1f525;) &#x1f353; 初衷:一起学习、一起进步、坚持不懈 &#x1f353; 如果文章内容有误与您的想法不一致,欢迎大家在评论区指正&#x1f64f; &#x1f353; 希望这篇文章对你有所帮助,欢…...

Centos7.9实现多台机器ssh免密登录

1.本机&#xff08;172.16.10.228&#xff09;先生成密钥对 ssh-keygen -t rsa 2.执行命令&#xff0c;把本机公钥拷贝到远程机器 ssh-copy-id rootdistinctIp 3.查看一下远程机器 、/root/.ssh/authorized_keys文件 cat /root/.ssh/authorized_keys 会看到里边多了个公钥…...

Unity3D DOTS JobSystem物理引擎的使用详解

前言 Unity3D DOTS&#xff08;Data-Oriented Technology Stack&#xff09;是Unity引擎的一项新技术&#xff0c;旨在提高游戏性能和扩展性。其中的Job System是一种用于并行处理任务的系统&#xff0c;可以有效地利用多核处理器的性能。在本文中&#xff0c;我们将重点介绍如…...

vue3+element-plus 表单校验和循环form表单校验

1.HTML页面 //el-form 标签添加上 ref"form2Form" :rules"rules2" :model"form2" 正常表单校验 //没有循环表单的使用事例<el-form-item label"投保人名称" class"insurance-date-no1" prop"tbrName">…...

Java集合基础知识点系统性总结篇

目录 集合一、图解集合的继承体系&#xff1f;&#xff08;[图片来源](https://www.cnblogs.com/mrhgw/p/9728065.html)&#xff09;点击查看大图二、List,Set,Map三者的区别&#xff1f;三、List接口的实现3.1、Arraylist 、 LinkedList、Vector3.2、Arraylist 、 LinkedList、…...

智能网联汽车信息安全风险识别与应对策略研究综述

摘要&#xff1a;随着智能网联汽车技术的飞速发展&#xff0c;其信息安全问题逐渐成为公众关注的焦点。本文概述了智能网联汽车技术的发展背景和信息安全风险的来源&#xff0c;采用STRIDE威胁分析方法对智能网联汽车的四层模型进行风险识别&#xff0c;进一步探讨了抗女巫攻击…...

python-web应用程序-Django数据库-数据库表设计

python-web应用程序-Django数据库-数据库表设计 在models中创建一个类会自动对数据库进行管理&#xff0c;那么如何用类的声明来实现数据库表的设计呢&#xff1f; from django.db import models# Create your models here. class Department(models.Model):title models.Ch…...

C#知识|封装典型的SQLServer数据库查询方法。

哈喽,你好啊,我是雷工! 前边学习封装了增删改的方法封装: 《C#知识|通用数据访问类SQLHelper的编写》; 本节继续学习将两种典型的查询方法封装成类。 下边为学习笔记。 01 封装单一返回结果的封装 在查看封装后的代码之前,可以先看下封装前代码的写法: 《C#知识|通过A…...

第一篇 逻辑门(与门、或门、非门、异或门)

一、实验目的 了解DE1-SOC开发板一些外设。 掌握常用组合逻辑门电路的基本原理。 学习Verilog HDL的基本语法。 学习使用ModelSim工具对设计的电路进行仿真&#xff0c;包括编写Testbench仿真代码&#xff0c;以及ModelSim工具的使用。 熟悉使用Quartus软件从创建Quartus工…...

车牌号码智能监测识别摄像机

车牌号码智能监测识别摄像机是一项革命性的技术&#xff0c;为交通管理和安全提供了全新的解决方案。这种摄像机利用先进的人工智能和图像识别技术&#xff0c;能够实时监测道路上的车辆&#xff0c;并准确识别车辆的车牌号码&#xff0c;为交通管理和安全提供了强有力的支持。…...

Python局部变量:深入探索与实战应用

Python局部变量&#xff1a;深入探索与实战应用 在Python编程中&#xff0c;局部变量是一个至关重要的概念。它们被定义在函数或方法内部&#xff0c;并且只在定义它们的那个特定的代码块中可见。然而&#xff0c;局部变量的使用并不总是那么简单明了&#xff0c;尤其是当涉及…...

Java面试八股之怎么降低锁竞争

怎么降低锁竞争 减少锁的持有时间&#xff1a; 尽量缩短线程持有锁的时间&#xff0c;只在必要时才获取锁&#xff0c;一旦操作完成立即释放锁。可以通过将同步代码块的范围缩小到最小必要程度来实现&#xff0c;避免在锁保护的代码块中执行耗时操作或等待操作&#xff0c;比如…...

数组的操作方法

数组的操作方法 forEach 循环 数组的私有方法 7个内置操作方法 1.push 尾部添加 2.pop 尾部删除 3.shift 头部删除 4.unshift 头部添加 5.splice 删除 替换 插入(本质是删除 返回的是删除的元素组成的数组[因为可以删除多个…...

RK3588 Android13添加开机logo或开机动画

wzhlenkeng-HP-Pro-Tower-ZHAN-99-G9-Desktop-PC:/media/extern_sda/wzh/rk3588_android/device/rockchip/rk3588$ git show commit e8da2099dccfed7f7b348c2e324d9c3d3e555d39 (HEAD) Author: wzh <wuzenghonglenkeng.com> Date: Tue Jun 4 09:53:48 2024 0800添加开…...

Phi-3-mini-4k-instruct-gguf实战教程:集成到Notion插件实现笔记自动摘要

Phi-3-mini-4k-instruct-gguf实战教程&#xff1a;集成到Notion插件实现笔记自动摘要 1. 项目背景与目标 你是否经常在Notion中积累了大量笔记&#xff0c;却苦于没有时间整理和提炼关键信息&#xff1f;本文将带你一步步将Phi-3-mini-4k-instruct-gguf模型集成到Notion插件中…...

基于STM32LXXX的数字电位器(MCP41010T-I/SN)驱动应用程序设计

一、简介&#xff1a;MCP41010T-I/SN 是 Microchip 公司推出的一款单通道、8位数字电位器&#xff0c;采用 SPI 串行接口进行通信。该器件将传统的机械电位器功能数字化&#xff0c;通过简单的数字指令精确调节电阻值&#xff0c;特别适用于需要软件控制电路参数的嵌入式系统。…...

丹青幻境问题解决:避讳词设置与角色畸形手指修复指南

丹青幻境问题解决&#xff1a;避讳词设置与角色畸形手指修复指南 1. 引言&#xff1a;AI绘画中的常见挑战 在使用丹青幻境进行角色设计时&#xff0c;许多创作者都会遇到两个典型问题&#xff1a;一是生成的图像中出现不想要的元素&#xff0c;二是角色手指等细节部位出现畸形…...

从Simulink仿真到硬件实现:DAB双有源全桥的PID参数‘手感’如何传递?

从虚拟到现实&#xff1a;DAB双有源全桥PID参数迁移实战指南 当你在Simulink中看到完美的DAB动态响应波形时&#xff0c;那种成就感就像解开一道复杂的数学题。但现实往往给你当头一棒——同样的PID参数烧录到DSP后&#xff0c;示波器上的波形却像喝醉了一样东倒西歪。这不是你…...

SecGPT-14B高阶用法:在OpenClaw中实现多模型协同安全分析

SecGPT-14B高阶用法&#xff1a;在OpenClaw中实现多模型协同安全分析 1. 为什么需要多模型协同分析&#xff1f; 作为一名长期与安全日志打交道的工程师&#xff0c;我经常面临一个困境&#xff1a;面对海量的系统日志&#xff0c;如何既保证分析效率又不遗漏关键威胁&#x…...

PX4固件版本不对,Offboard模式失灵?手把手教你给Pixhawk 4刷回旧版固件(附v1.11.0固件下载)

PX4固件版本不匹配导致Offboard模式失效&#xff1f;Pixhawk 4降级刷机全指南 最近在调试无人机Offboard模式时&#xff0c;不少开发者反馈最新版PX4固件出现兼容性问题——明明MAVLink指令发送正常&#xff0c;飞控却拒绝进入Offboard模式。这种"沉默式失效"往往让…...

gte-base-zh WebUI安全加固:禁用CORS、关闭Swagger UI、限制Referer白名单

gte-base-zh WebUI安全加固&#xff1a;禁用CORS、关闭Swagger UI、限制Referer白名单 重要提示&#xff1a;本文介绍的安全加固方案适用于生产环境部署&#xff0c;可有效防止未授权访问和数据泄露风险。 1. 为什么需要WebUI安全加固 当你使用xinference部署gte-base-zh embe…...

在Vivado里调通3/4删余卷积码Viterbi译码:从分支度量到回溯的完整避坑指南

Vivado平台实现3/4删余卷积码Viterbi译码的工程实践 在数字通信系统中&#xff0c;卷积码因其优异的纠错性能被广泛应用。802.11a等标准中采用的删余卷积码技术&#xff0c;通过有选择地删除部分编码比特来提高码率。本文将深入探讨如何在Vivado平台上实现3/4删余卷积码的Viter…...

别再折腾了!Windows 10/11 下用 Anaconda 一键搞定 OpenPose Python 环境(附 CUDA 11.8 配置)

告别环境配置噩梦&#xff1a;Anaconda三分钟部署OpenPose全攻略 当你在深夜第三次重装CUDA驱动时&#xff0c;是否怀疑过人生&#xff1f;作为计算机视觉领域的里程碑式工具&#xff0c;OpenPose的人体姿态识别能力令人惊叹&#xff0c;但其复杂的环境配置却让无数开发者折戟沉…...

IBM与Arm合作推进双架构主机系统开发

IBM和Arm宣布合作开发能够运行IBM和Arm双重工作负载的硬件&#xff0c;使Arm软件能够在IBM主机上运行。两家公司计划在三个方面展开合作&#xff1a;构建虚拟化工具&#xff0c;让Arm软件能够在IBM平台上运行&#xff1b;确保Arm应用程序符合受监管行业必须遵循的安全和数据驻留…...