20260507笔记

张

张建站

2026/5/8 3:09:20

10分钟阅读

20260507笔记:vue: vue-router、vue的依赖package.json、组件下载更新机制、export与import、同步组件与异步组件。java: postgreSql的group by、DATE_TRUNC、case when ... then... end、vue1、vue-router2、vue项目的package.json与package-lock.json3、vue-router是做什么的4、组件存到了哪里是怎么下载的5、vue的import与export 是怎么用的6、vue-router的meta7、path: /:openType/:id,是什么意思8、vue-router使用同步组件与异步组件的区别java1、postgreSql: postgreSql和 mysql的 group by 行为不同2、日期截断函数 DATE_TRUNC3、CASE WHEN ... THEN ... END 判断语句vue1、vue-routervue-router 是vue官方核心插件就像java与springMvc2、vue项目的package.json与package-lock.json这两个文件在项目路径下package.json为可以为开发人员手动修改用于规定这个依赖能使用的范围package-lock.json为程序自动生成用于显示具体使用了哪个版本的依赖package.json与maven项目不同vue的依赖没有手动在xml中加依赖的行为但开发在控制台运行比如说npm install vue-router他就会将依赖自动加在package.json上当然你也可以手动修改package.json某个依赖的版本package-lock.json为控制你具体下载哪个版本package.json的依赖可确定范围比如说{dependencies:{vue:^3.4.0}}这个^3.4.0 的意思是3.4.0 ≤ 版本 4.0.0但当你首次 install 时就会根据规则下载具体的版本记录在package-lock.json里这样你上传到git后其他开发运行npm install 就会下载跟你一样的package-lock.json里的版本3、vue-router是做什么的因为浏览器默认切换页面时加载新的页面会闪烁传统网站是这样的为了让浏览器进行页面跳转时不闪烁vue采用了SPA单页应用的核心原理即vue项目一般只有一个主页面app.vue,切换页面时只是在切换app页面里的组件但这样出现了很对问题一个app页面只对应了一个网址你在输入网址后只会跳转到app页面的初始状态并且你页面的前进后退等切换页面功能都失效了此时vue提供了vue-router解决方案vue-router会监听、改变浏览器的 URL当你进行跳转时vue-router模拟了假的页面跳转他是怎么解决的。app页面只有一个url他在使用时会指定url的 history 控制策略比如说Hash 模式constroutercreateRouter({history:createWebHistory(),routes})history: createWebHashHistory()这个策略会让url变成 http://example.com/#/user/123 这种在原生浏览器设置中/#叫hash哈希/锚点后面的内容本身是不会不会作为url发送给浏览器的vue利用了这个技巧让你的url始终是 http://example.com始终指向app页面并且运行在浏览器的vue也能从/#/user/123里读取到具体的信息通过信息在app页面中加载具体的组件除了hash模式createWebHashHistory还有HTML5 模式createWebHistory、内存模式createMemoryHistoryHTML5 模式并没有使用hash哈希/锚点他的url就是http://example.com/user/123但这就没有指向app页面了就需要服务器里nginx配合让你的不同的url请求始终指向app页面,这样既能找到app页面又能读取路由# nginx 配置 location/{try_files $uri $uri//index.html;# 所有路径都返回 index.html}内存模式内存模式没有更改url,前进后退等都存在了内存中当然这样你每次刷新页面清除内存都会回到app页面的初始状态比较少用4、组件存到了哪里是怎么下载的组件部署到服务器后用户在浏览器中第一次访问会从浏览器下载组件的js文件并缓存到本地此时用户第二次访问就会从本地拿只有强制刷新(ctrlf6)或清缓存时会再次下载js文件那么重新部署项目后浏览器是怎么知道项目部署了的也不能我部署后让所有用户都手动刷新。在访问页面时vue还是会向服务器拿一些信息的下载的js文件有hash值比如说home.abc123.js重新部署后js文件变成了home.def456.js此时浏览器发现js文件有更新就会像服务器请求新的js文件5、vue的import与export 是怎么用的有两种暴露模式export default与exportexport default只能存在一个在import使用时暴露的是什么import拿到的就是什么export 可以存在多个且可以与export default并存使用时需要用{}暴露文件// 默认导出只能1个exportdefault[{name:ForTheRecord,component:ForTheRecord}]// 命名导出可以多个exportconstapiUrl/api/record exportconstmoduleName备案管理export functionformatRecord(data){returndata}加载文件importrecordRoutes,{apiUrl,moduleName,formatRecord}from ./modules/record.js如何把多个模块怎么收集成一个数组呢// router/index.jsimportrecordRoutesfrom ./modules/record.js// 数组1importuserRoutesfrom ./modules/user.js// 数组2importsettingRoutesfrom ./modules/setting.js// 数组3// 展开运算符合并成一个数组constallRoutes[...recordRoutes,// 把数组1的每个元素拿出来...userRoutes,// 把数组2的每个元素拿出来...settingRoutes// 把数组3的每个元素拿出来]6、vue-router的meta{path:/,name:Index,component:Index,meta:{requireAuth:true,aaa:123}}你可以在meta中设置各种标签信息这样你在访问时可以拿到这个标签// 2. 比如说路由守卫读标签router.beforeEach((to){if(to.meta.requireAuth){}})7、path: ‘/:openType/:id’,是什么意思// 直接写标准路由配置没有封装constroutercreateRouter({history:createWebHashHistory(),// Hash 模式URL 带 #routes:[{path:/:openType/:id,name:CustomIndex,component:Index},]})表示匹配两层路径openType与id都是随便写的形参且并不规定是数字还是字符串必须匹配两层不能多不能少比如说匹配 /edit/4568、vue-router使用同步组件与异步组件的区别// 方式1同步直接导入importHomePagefrom /views/HomePage.vue component:HomePage// 方式2异步函数导入component:()import(/views/AboutPage.vue)同步组件在页面打开就下载而异步组件是访问到路由才下载为了让用户不要一次下载太多使用异步组件用到时再下载一般首页这种组件才会使用同步组件其他的都可以使用异步组件java1、postgreSql: postgreSql和 mysql的 group by 行为不同PostgreSQL 更严格PostgreSQL 要求 SELECT 中的字段必须要么在 GROUP BY 中要么被聚合函数包裹。--❌ 错误PostgreSQLSELECTname,department,COUNT(*)FROMemployeesGROUPBYdepartment;--✅ 正确SELECTdepartment,COUNT(*)FROMemployeesGROUPBYdepartment;--MySQLSELECTid,name,department,COUNT(*)FROMordersGROUPBYdepartment;在PostgreSQL里必须改成--要么说明 id 和 name 怎么处理SELECTMIN(id)ASany_id,MIN(name)ASany_name,department,COUNT(*)FROMordersGROUPBYdepartment;2、日期截断函数 DATE_TRUNCDATE_TRUNC 是 PostgreSQL 的日期截断函数DATE_TRUNC(month,2025-03-1514:30:25)--结果2025-03-0100:00:00DATE_TRUNC(quarter, 2025-05-1514:30:25)//季度截断--结果2025-04-0100:00:003、CASE WHEN … THEN … END 判断语句CASE 是 SQL 的 if-then-else 语句基本语法CASEWHEN条件1THEN结果1WHEN条件2THEN结果2ELSE结果3END

AMD SCU35 FPGA评估套件开发指南与应用解析

1. AMD SCU35 FPGA评估套件概述AMD SCU35评估套件是一款面向工业、医疗和数据中心应用的FPGA开发平台，核心搭载Spartan UltraScale SU35P FPGA芯片。这款售价229美元的开发板以其丰富的扩展接口和低功耗特性，成为边缘计算和物联网应用的理想选择。这块14…...

2026/5/8 3:06:29 阅读更多 →

AgentBench：多环境基准测试实战，全面评估LLM智能体能力

1. 项目概述：AgentBench，一个重新定义LLM智能体能力的基准测试如果你最近在关注大语言模型（LLM）如何从“聊天机器人”进化为能执行复杂任务的“智能体”，那么你一定听说过各种炫酷的演示：让AI帮你订机票、…...

2026/5/8 3:03:36 阅读更多 →

LLaVA多模态大模型实战：从原理到部署的视觉语言助手构建指南

1. 项目概述：LLaVA，一个让大语言模型“看见”世界的视觉助手如果你和我一样，长期关注大语言模型（LLM）的发展，可能会发现一个明显的瓶颈：这些模型虽然能说会道，但本质上还是“盲人”。…...

2026/5/8 3:01:30 阅读更多 →

C语言RTOS多核协同失效真相：Cache一致性缺失、内存序乱序、GCC -O2优化陷阱——三重危机诊断工具链实战

更多请点击： https://intelliparadigm.com 第一章：C语言RTOS多核协同失效的系统性认知在嵌入式实时系统中，基于C语言开发的RTOS（如FreeRTOS、Zephyr或RT-Thread）常被移植至ARM Cortex-A/R系列或多核RISC-V SoC平台。…...

2026/5/8 3:27:44 阅读更多 →

Zotero GPT终极指南：用AI轻松读懂学术文献的研究态度与情感倾向

Zotero GPT终极指南：用AI轻松读懂学术文献的研究态度与情感倾向【免费下载链接】zotero-gpt GPT Meet Zotero. 项目地址: https://gitcode.com/gh_mirrors/zo/zotero-gpt 你是否曾被海量学术文献淹没？是否在阅读论文时难以快速把握作者的研究立场…...

2026/5/8 1:39:53 阅读更多 →