vue基础3
1.推荐好用的第三方框架
BootCDN - Bootstrap 中文网开源项目免费 CDN 加速服务
1.moment.js
2.dayjs
2.收集表达数据
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>Document</title><!-- 引入Vue --><script type="text/javascript" src="../js/vue.js"></script><style></style>
</head>
<!-- 收集表单数据：若：<input type="text"/>,则v-model收集的是value值，用户输入的就是value值。若：<input type="radio"/>,则v-model收集的是value值，且要给标签配置value值若：<input type="checkbox"/>1.没有配置input的value属性，那么收集的就是checked(勾选 or 未勾选，是布尔值)2.配置input的value属性：(1)v-model的初始值是非数组，那么收集的就是checked(勾选 or 未勾选，是布尔值）(2)v-model的初始值是数组，那么收集的的就是value组成的数组备注：v-model的三个修饰符：lazy:失去焦点再收集数据number：输入字符串转为有效的数字trim：输入首尾空格过滤
--><body><!-- 准备好一个容器 --><div id="root"><form @submit.prevent="demo"><!-- 使用label标签让label里的内容与一个标签作为关联 --><label for="demo"> 账号：</label><!-- 去掉前后空格 --><input type="text" name="" id="demo" v-model.trim="userInfo.account"><br><label for="password">密码：</label><input type="password" name="" id="password" v-model="userInfo.password"><br><label for="age">年龄：</label><!-- 转成 数字类型 --><input type="number" name="" id="age" v-model.number="userInfo.age"><br><label for="sex">性别：</label><!-- 单选框 -->男<input type="radio" value="男" v-model="userInfo.sex">女<input type="radio" value="女" v-model="userInfo.sex"><br>爱好：学习<input type="checkbox" value="study" v-model="userInfo.hobby"><!-- 不写value默认收集的就是checked 布尔值 -->打游戏<input type="checkbox" value="playgame" v-model="userInfo.hobby">吃饭<input type="checkbox" value="eating" v-model="userInfo.hobby"><br>所属校区：<select v-model="userInfo.city"><option value="">请选择校区</option><option value="beijing">北京</option><option value="shanghai">上海</option><option value="shenzhen">深圳</option><option value="wuhan">武汉</option></select><br>其他信息<!-- 懒加载 当失去焦点的时候才获取值 --><textarea v-model.lazy="userInfo.otherInfo"></textarea><br><input type="checkbox" v-model="userInfo.agree"> 阅读并接受 <a href="http://www.baidu.com">《用户协议》</a><br><button>提交</button></form></div><script type="text/javascript">Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示const vm = new Vue({el: "#root",data: {userInfo: {account: '',password: '',age:19,sex: '2',hobby: [],city: 'beijing',otherInfo: '',agree: false}},methods: {demo() {console.log(JSON.stringify(this._data));}},})</script></body></html>3.过滤器
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>过滤器</title><!-- 引入Vue --><script type="text/javascript" src="../js/vue.js"></script><script type="text/javascript" src="../js/dayjs.min.js"></script>
</head><!-- 过滤器：定义：对要显示的数据进行特定格式化后再显示（适用于一些简单逻辑的处理）。语法：1.注册过滤器：Vue.filter(name,callback)或 new Vue{filters:{}}2.使用过滤器：{{xxx|过滤器名}}或 v-bind：属性="xxx|过滤器名”备注：1.过滤器也可以接收额外参数、多个过滤器也可以串联2.并没有改变原本的数据，是产生新的对应的数据-->
<body><!-- 准备好一个容器 --><div id="root"><h2>显示格式化后的时间</h2><!-- 计算属性实现 --><h3>现在的时间是:{{date}}</h3><!-- 计算属性实现 --><h3>现在的时间是:{{dateFun()}}</h3><!-- 过滤器实现 --><h3>现在的时间是:{{time | timeFormat('YYYY-MM-DD') | mySlice}}</h3><hr><h3 :x="msg | mySlice">尚硅谷</h3></div><!-- 准备好一个容器 --><div id="root2"><h2>显示格式化后的时间</h2><!-- 过滤器实现 --><h3>现在的时间是:{{time | mySlice}}</h3></div><script type="text/javascript" >Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示Vue.filter('mySlice',function(val){return val.toString().slice(0,4);})const vm = new Vue({el:"#root",data: {time:Date.now(),msg:'你好,尚硅谷'},methods: {dateFun(){return dayjs(this.time).format('YYYY-MM-DD HH:mm:ss');}},computed:{date(){return dayjs(this.time).format('YYYY-MM-DD HH:mm:ss');}},// 局部过滤器filters:{timeFormat(val,format){if(format!==null){return dayjs(val).format(format);}else{return dayjs(val).format('YYYY-MM-DD HH:mm:ss');}}}}) const vm2 = new Vue({el:"#root2",data: {time:Date.now()}}) setInterval(()=>{vm.time = Date.now()},1000)</script></body>
</html>4.cookie
勾上后只能被 http携带
5.自定义指令
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><!-- 引入Vue --><script type="text/javascript" src="../js/vue.js"></script>
</head>
<body><!-- 需求1:定义一个v-big指令,和v-text功能类似，但会把绑定的数值放大10倍，需求2:定义一个v-fbind指令，和 v-bind功能类似，但可以让其所绑定的input元素默认获取焦点。--><!-- 自定义指令总结：一、定义语法：（1）.局部指令：new Vue({ new Vue({directives:{指令名：配置对象} 或 方法 directives:{指令名(){}}}) ([bind:(){},inserted:(){},update(){}]) })（2）.全局指令：Vue.directive(指令名，配置对象）或 Vue.directive(指令名，回调函数）二、配置对象中常用的3个回调：(1）.bind：指令与元素成功绑定时调用。(2）.inserted：指令所在元素被插入页面时调用。(3）.update：指令所在模板结构被重新解析时调用。三、备注：1.指令定义时不加v-，但使用时要加v-；2.指令名如果是多个单词，要使用kebab-case命名方式，不要用camelCase命名。--><!-- 准备好一个容器 --><div id="root">{{name}}<h2>当前的n值是<span v-text="n"></span></h2><h2>放大10倍后的n值是<span v-big="n"></span></h2><button @click="n++">点我n+1</button><button @click="jiejue">点我变化name</button><hr><!-- <input type="text" v-fbind:value="n" autofocus> autofocus 自动获取焦点 不是什么浏览器都好使 --><input type="text" v-fbind:value="n"></div><!-- 准备好一个容器 --><div id="root2">{{name}}<h2>当前的n值是<span v-text="n"></span></h2><h2>放大10倍后的n值是<span v-big="n"></span></h2><button @click="n++">点我n+1</button><button @click="jiejue">点我变化name</button><hr><!-- <input type="text" v-fbind:value="n" autofocus> autofocus 自动获取焦点 不是什么浏览器都好使 --><input type="text" v-fbind1:value="n"></div><script type="text/javascript" >Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示Vue.directive('fbind1',{bind(element,binding){console.log('bind全局',this);//指令与元素成功绑定时(一上来)element.value = binding.value;},inserted(element,binding){//指令所在元素被插入页面时element.focus();console.log('inserted全局',this);},//局部指令update(element,binding){//指令所在的模板被重新解析时console.log('update全局',this);//注意此处时windowelement.value = binding.value;}});const vm = new Vue({el:"#root",data: {name:2,n:1},methods: {jiejue(){this.name++;}},// 函数式定义指令directives:{//big函数合适会被调用？1.指令与元素成功绑定时调用（一上来）2.指令所在的模板被重新解析时//名字比较长就用 -隔开 然后在定义指令的时候用原生写法 'big-number':function(e,b){}big(element,binding){// console.dir(element) 详细输出element// console.log(element instanceof HTMLElement); true// console.log(b);console.log('big',this);element.innerText=binding.value*10;},fbind:{bind(element,binding){console.log('bind',this);//指令与元素成功绑定时(一上来)element.value = binding.value;console.log('bind');},inserted(element,binding){//指令所在元素被插入页面时console.log('inserted');element.focus();console.log('inserted',this);},//局部指令update(element,binding){//指令所在的模板被重新解析时console.log('update');console.log('update',this);//注意此处时windowelement.value = binding.value;}}}}) new Vue({el:'#root2',data: {name:2,n:1},methods: {jiejue(){this.name++;}}, // 函数式定义指令directives:{//big函数合适会被调用？1.指令与元素成功绑定时调用（一上来）2.指令所在的模板被重新解析时//名字比较长就用 -隔开 然后在定义指令的时候用原生写法 'big-number':function(e,b){}big(element,binding){// console.dir(element) 详细输出element// console.log(element instanceof HTMLElement); true// console.log(b);console.log('big',this);element.innerText=binding.value*10;},fbind:{bind(element,binding){console.log('bind',this);//指令与元素成功绑定时(一上来)element.value = binding.value;console.log('bind');},inserted(element,binding){//指令所在元素被插入页面时console.log('inserted');element.focus();console.log('inserted',this);},//局部指令update(element,binding){//指令所在的模板被重新解析时console.log('update');console.log('update',this);//注意此处时windowelement.value = binding.value;}}}})</script></body>
</html>6.引出生命周期
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>Document</title><!-- 引入Vue --><script type="text/javascript" src="../js/vue.js"></script>
</head><!-- 生命周期：1.又名：生命周期回调函数、生命周期函数、生命周期钩子。2.是什么：Vue在关键时刻帮我们调用的一些特殊名称的函数。3.生命周期函数的名字不可更改，但函数的具体内容是程序员根据需求编写的。4.生命周期函数中的this指向是vm 或组件实例对象。--><body><!-- 准备好一个容器 --><div id="root"><!-- opacity透明度 0~1 --><h2 v-if="a">你好啊</h2><h2 :style="h2style">欢迎学习Vue</h2></div><script type="text/javascript">Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示const vm = new Vue({el: "#root",data: {a:false,h2style: {opacity: 0.2,},},methods: {},// Vue完成模板的解析，并把初始的真实的DOM元素放入页面后 (挂载完毕) 调用mountedmounted() {console.log('mounted',this);//vm setInterval(() => {this.h2style.opacity -= 0.01;if (this.h2style.opacity <= 0) {this.h2style.opacity = 1;}}, 16);this.a=true;},})// window.onload=()=>{// // vm.change(); 页面加载完再调用// }//通过外部的定时器实现(不推荐)// setInterval(() => {// vm.h2style.opacity-=0.01;// if(vm.h2style.opacity<=0){// vm.h2style.opacity = 1;// }// }, 16);</script></body></html>
这个事件监听器指的是自定义事件
7.分析生命周期
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>Document</title><!-- 引入Vue --><script type="text/javascript" src="../js/vue.js"></script>
</head><body><!-- 准备好一个容器 --><div id="root"><h2>当前的n值是:{{n}}</h2><button @click="add">点我n+1</button><button @click="bye">点我销毁vm</button></div><script type="text/javascript">Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示const vm = new Vue({el: "#root",//把整个template替换上面root 的div// template: ` // <div>// <h2>当前的n值是{{n}}</h2>// <button @click="add">点我n+1</button>// </div>// `,data: {n: 1},methods: {add() {this.n++;},bye(){console.log('bye');this.$destroy();//销毁vm}},beforeCreate() {console.log('beforeCreate');// console.log(this.n);// debugger;//这是前端的debug },created() {console.log('created');},beforeMount() {console.log('beforeMount');//其实vue已经解析完了，没有往页面放呢// debugger;},mounted() {console.log('mounted ');console.log(this.$el instanceof HTMLElement);//true},beforeUpdate() {console.log('beforeUpdate');console.log(this.n);// debugger;},updated() {console.log('updated'); },beforeDestroy() {console.log('beforeDestroy');}, destroyed() {console.log('destroy');},})</script></body></html>8.总结生命周期
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>Document</title><!-- 引入Vue --><script type="text/javascript" src="../js/vue.js"></script>
</head><!-- 常用的生命周期钩子：1.mounted: 发送ajax请求、启动定时器、绑定自定义事件、订阅消息等【初始化操作】。2.beforeDestroy：清除定时器、解绑自定义事件、取消订阅消息等【收尾工作】。关于销毁Vue实例1.销毁后借助Vue开发者工具看不到任何信息。2.销毁后自定义事件会失效，但原生DOM事件依然有效。3.一般不会在beforeDestroy操作数据，因为即便操作数据，也不会再触发更新流程了。
--><body><!-- 准备好一个容器 --><div id="root"><!-- opacity透明度 0~1 --><h2 v-if="a">你好啊</h2><h2 :style="h2style">欢迎学习Vue</h2><button @click="h2style.opacity=1">透明度设置为1</button><button @click="stop">点我停止</button></div><script type="text/javascript">Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示const vm = new Vue({el: "#root",data: {a: false,h2style: {opacity: 0.2,},},methods: {stop() {this.$destroy();}},// Vue完成模板的解析，并把初始的真实的DOM元素放入页面后 (挂载完毕) 调用mountedmounted() {console.log('mounted', this);//vm this.timer = setInterval(() => {//返回的是定时器的id 数字类型 唯一标识console.log("setInterval");this.h2style.opacity -= 0.01;if (this.h2style.opacity <= 0) {this.h2style.opacity = 1;}}, 16);this.a = true;},beforeDestroy() {console.log('清除定时器成功');clearInterval(this.timer)//放入唯一标识清除定时器},})// window.onload=()=>{// // vm.change(); 页面加载完再调用// }//通过外部的定时器实现(不推荐)// setInterval(() => {// vm.h2style.opacity-=0.01;// if(vm.h2style.opacity<=0){// vm.h2style.opacity = 1;// }// }, 16);</script></body></html>相关文章：
vue基础3
1.推荐好用的第三方框架 BootCDN - Bootstrap 中文网开源项目免费 CDN 加速服务 1.moment.js 2.dayjs 2.收集表达数据 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><title>Document</title><…...
LINUX -exec函数族
1、功能： *让父子进程来执行不相干的操作 *能够替换进程地址空间的代码.text段 *执行另外的程序，不需要创建额外的的地址空间 *当前程序中调用另外一个应用程序 2、执行目录下的程序： *指定执行目录下的程序 int execl(const char *path,…...
c++ 智能指针shared_ptr与make_shared
shared_ptr是C11引入的一种智能指针，它允许多个shared_ptr实例共享同一个对象，通过引用计数来管理对象的生命周期。当最后一个持有对象的shared_ptr被销毁时，它会自动删除所指向的对象。这种智能指针主要用于解决资源管理问题&…...
2024-HW最新漏洞整理及相应解决方案（二）
目录 前言： 漏洞 1.用友NC系统电采complainjudge接口的sql注入漏洞 2.用友U8 CRM产品存在SQL注入漏洞 3.WordPress LMS 插件任意文件上传漏洞 4.Oracle Fusion Middleware 安全漏洞CVE-2024-21181 5.WordPress plugin LearnPress 安全漏洞CVE-2024-6589 6.W…...
spring boot整合JPA兼容MySQL8和达梦数据库8
前言 Spring Boot是一个基于Spring框架的快速开发框架，它可以简化Spring应用的配置和部署过程。JPA（Java Persistence API）是Java持久化规范的一种实现，它提供了一种统一的方式来访问和管理数据库。MySQL和达梦数据库都是常用的关…...
规划决策算法（四）---Frenet坐标系
知乎：坐标系转换 1.Frenet 坐标系 什么是 Frenet 坐标系： 为什么使用 Frenet 坐标系： 通常情况，我们只会关注车辆当前距离左右车道线的距离，来判断是否偏离车道，是否需要打方向盘进行方向微调。而不是基于…...
大数据处理：大数据处理框架Hadoop、Spark
大数据处理是当代信息技术领域的一个重要分支，它涉及到海量数据的存储、管理和分析。为了高效地应对大数据处理的挑战，多种框架被开发出来，其中Hadoop和Spark是最为知名和广泛应用的两种。以下将详细介绍这两种框架以及它们在大数据处理中的应…...
网传的高频流量费会影响到个人用户的算法和策略T0吗？
先解答这个问题：高频的流量费这个确实是会影响你自己算法的交易的！但是，强调一个但是：有的券商是没有流量费的！小编今天就来带大家了解一下！第一：算法交易的应用场景！ 算法交易的主…...
阿里云服务器 Ubuntu18.04 安装 mysql8.0并允许外部连接
参考教程： 官网教程 参考教程一 首先彻底删除mysql5.7 dpkg --list|grep mysql #查看 sudo apt-get remove mysql-common #卸载 sudo apt-get autoremove --purge mysql-server-5.7 #版本自己修改 dpkg -l|grep ^rc|awk {print$2}|sudo xargs dpkg -P #清除残留数…...
(Arxiv-2023)MobileDiffusion：移动设备上即时文本到图像生成
MobileDiffusion：移动设备上即时文本到图像生成 Paper Title：MobileDiffusion: Instant Text-to-Image Generation on Mobile Devices Paper是谷歌出品 Paper地址 图 1：MobileDiffusion 用于 (a) 文本到图像的生成。(b) Canny 边缘到图像、风…...
【七】Hadoop3.3.4基于ubuntu24的分布式集群安装
文章目录 1. 下载和准备工作1.1 安装包下载1.2 前提条件 2. 安装过程STEP 1: 解压并配置Hadoop选择环境变量添加位置的原则检查环境变量是否生效 STEP 2: 配置Hadoop2.1. 修改core-site.xml2.2. 修改hdfs-site.xml2.3. 修改mapred-site.xml2.4. 修改yarn-site.xml2.5. 修改hado…...
【Rust光年纪】深入了解Rust语言的关键库：功能特点与使用场景分析
探索Rust语言下的重要库：硬件接口控制和数据库操作全解析 前言 随着Rust语言在嵌入式开发和数据库操作领域的不断发展，越来越多的优秀库和工具涌现出来。本文将介绍一些用于Rust语言的重要库，包括硬件接口库、嵌入式硬件抽象层、ORM和查询构…...
矩估计与最大似然估计的通俗理解
点估计与区间估计 矩估计与最大似然估计都属于点估计，也就是估计出来的结果是一个具体的值。对比区间估计，通过样本得出的估计值是一个范围区间。例如估计馒头店每天卖出的馒头个数，点估计就是最终直接估计每天卖出10个，而区间估…...
性能调优本质：如何精准定位瓶颈并实现系统极致优化
目录 先入为主的反例 性能调优的本质 性能调优实操案例 性能调优相关文章 先入为主的反例 在典型的 ETL 场景中，我们经常需要对数据进行各式各样的转换，有的时候，因为业务需求太复杂，我们往往还需要自定义 UDF（User Defined Functions）来实现特定的转换逻辑。 但是…...
Git的命令
git add . 添加到暂存区 git commit -m 备注 提交 git branch 查看所有分支 git branch -d 分支名 删除分支 git push origin --delete 分支名 远程分支删除 git branch -a 查看删除后的分支 git clone 地址 例如https://gitee.com/whale456/demo.git git push origin m…...
WPF中使用定时器更新元素-DispatcherTimer
在WPF中使用定时器来更新UI元素是一种常见且有用的做法，特别是当你需要基于时间间隔来刷新数据或执行某些操作时。DispatcherTimer是WPF中用于在UI线程上执行周期性任务的理想选择，因为它确保了对UI元素的更新是线程安全的 例子程序 每隔0.5s 界面中的…...
计算机网络 - 理解HTTP与HTTPS协议的关键区别与安全性
作者：逍遥Sean 简介：一个主修Java的Web网站\游戏服务器后端开发者 主页：https://blog.csdn.net/Ureliable 觉得博主文章不错的话，可以三连支持一下~ 如有疑问和建议，请私信或评论留言！ 前言 在今天的互联网…...
【Spring Framework】使用XML配置文件配置Bean的实例化方式
在 Spring Framework 中，实例化 bean 的方式非常灵活，允许开发人员根据需求选择不同的方法。以下是几种常见的实例化 bean 的方式及其示例： 1. 通过无参构造函数实例化 这是最常见的方式，Spring 会使用 bean 的默认无参构造函数…...
模拟电子技术-实验四 二极管电路仿真
实验四 二极管电路仿真 一．实验类型 验证性实验 二．实验目的 1、验证二极管的单向导电性 2、验证二极管的稳压特性。 三．实验原理 二极管的单向导电性： 四、实验内容 1、二极管参数测试仿真实验 1）仪表仿真…...
Git 子仓（Git Submodule）学习
Git 子仓学习 Git 子仓（Submodule）是 Git 提供的一种功能，用于在一个 Git 仓库（称为主仓库或 superproject）中嵌入另一个 Git 仓库（称为子仓或 submodule）。这种功能在管理大型项目或依赖关系较…...
生成xcframework
打包 XCFramework 的方法 XCFramework 是苹果推出的一种多平台二进制分发格式，可以包含多个架构和平台的代码。打包 XCFramework 通常用于分发库或框架。 使用 Xcode 命令行工具打包 通过 xcodebuild 命令可以打包 XCFramework。确保项目已经配置好需要支持的平台…...
以下是对华为 HarmonyOS NETX 5属性动画（ArkTS）文档的结构化整理，通过层级标题、表格和代码块提升可读性：
一、属性动画概述NETX 作用：实现组件通用属性的渐变过渡效果，提升用户体验。支持属性：width、height、backgroundColor、opacity、scale、rotate、translate等。注意事项： 布局类属性（如宽高）变化时&#…...
基于ASP.NET+ SQL Server实现（Web）医院信息管理系统
医院信息管理系统 1. 课程设计内容 在 visual studio 2017 平台上，开发一个“医院信息管理系统”Web 程序。 2. 课程设计目的 综合运用 c#.net 知识，在 vs 2017 平台上，进行 ASP.NET 应用程序和简易网站的开发；初步熟悉开发一…...
自然语言处理——循环神经网络
自然语言处理——循环神经网络 循环神经网络应用到基于机器学习的自然语言处理任务序列到类别同步的序列到序列模式异步的序列到序列模式 参数学习和长程依赖问题基于门控的循环神经网络门控循环单元（GRU）长短期记忆神经网络（LSTM）…...
大数据学习（132）-HIve数据分析
🍋🍋大数据学习🍋🍋 🔥系列专栏： 👑哲学语录: 用力所能及，改变世界。 💖如果觉得博主的文章还不错的话，请点赞👍收藏⭐️留言Ǵ…...
C++.OpenGL （14/64）多光源（Multiple Lights）
多光源（Multiple Lights） 多光源渲染技术概览 #mermaid-svg-3L5e5gGn76TNh7Lq {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-3L5e5gGn76TNh7Lq .error-icon{fill:#552222;}#mermaid-svg-3L5e5gGn76TNh7Lq .erro…...
【C++进阶篇】智能指针
C内存管理终极指南：智能指针从入门到源码剖析 一. 智能指针1.1 auto_ptr1.2 unique_ptr1.3 shared_ptr1.4 make_shared 二. 原理三. shared_ptr循环引用问题三. 线程安全问题四. 内存泄漏4.1 什么是内存泄漏4.2 危害4.3 避免内存泄漏 五. 最后 一. 智能指针 智能指…...
聚六亚甲基单胍盐酸盐市场深度解析：现状、挑战与机遇
根据 QYResearch 发布的市场报告显示，全球市场规模预计在 2031 年达到 9848 万美元，2025 - 2031 年期间年复合增长率（CAGR）为 3.7%。在竞争格局上，市场集中度较高，2024 年全球前十强厂商占据约 74.0% 的市场…...
2025.6.9总结（利与弊）
凡事都有两面性。在大厂上班也不例外。今天找开发定位问题，从一个接口人不断溯源到另一个 接口人。有时候，不知道是谁的责任填。将工作内容分的很细，每个人负责其中的一小块。我清楚的意识到，自己就是个可以随时替换的螺丝钉&…...
StarRocks 全面向量化执行引擎深度解析
StarRocks 全面向量化执行引擎深度解析 StarRocks 的向量化执行引擎是其高性能的核心设计，相比传统行式处理引擎（如MySQL），性能可提升 5-10倍。以下是分层拆解： 1. 向量化 vs 传统行式处理 维度行式处理向量化处理数…...