Vue3_part3—Vue指令和声明式渲染
Vue3 指令
什么是指令
Vue 指令(Directives)是 Vue.js 的一项核心功能,它们可以在 HTML
模板中以 v- 开头的特殊属性形式使用,用于将响应式数据绑定到 DOM
元素上或在 DOM 元素上进行一些操作。
Vue 指令是带有前缀 v- 的特殊 HTML 属性,它赋予 HTML
标签额外的功能。
指令本质上是对 DOM 操作的封装,让你可以通过声明式的方式控制 DOM。
指令的基本语法
1<element v-directive:argument.modifier="expression"></element>
指令名称:v-directive(如
v-if、v-for)
参数:argument(可选,如
v-bind:href 中的
href)参数在指令后以冒号指明。
修饰符:modifier(可选,如
v-on:click.stop 中的 stop)修饰符是以半角句号
....
Vue3 part2—Vue基础知识与组合式API
学Vue前的基础语法
插值表达式
插值表达式(Template Literal Interpolation)是 ES6
(ECMAScript 2015)
引入的特性,它允许你在字符串中直接嵌入变量、表达式或函数调用结果。
插值表达式有很多插值方法
传统的方法就是字符串拼接,使用 +
运算符将变量或表达式与字符串连接起来。
123const name = "Alice";const greeting = "Hello, " + name + "!";console.log(greeting); // 输出: Hello, Alice!
它兼容性极佳,适用于所有 JavaScript 环境,而且性能相对较好
模板字符串是 JavaScript ES6
引入的一种新特性,使用反引号(`)包裹字符串,并在
${}中放置要插入的内容。
1234567891011// 基本变量插值const name = "张三";const age = 25;//...
隙间画谈—清河门火车站
...
Vue3 part1—了解前端框架Vue及其构建工具Vite
了解前端框架
实际上,我在学习了很长一段时间的后端之后才接触到前端框架,所以说,这是一个比较尴尬的事情
后端的框架我们都比较熟悉,主要内容其实无非就是用于处理处理业务逻辑和数据持久化
后端框架是面向服务设计的,它更关注数据的正确性和安全性,倾向于实际业务的逻辑和数据
而且后端框架一般都会有很多的关于多线程并发处理的内容,因为这会提升性能
而 Vue
这种前端框架,它是处理用户交互和数据展示的,主要是用户与业务的交互
Vue
是面向组件设计的,这是前端框架设计模式的一种,而且它着重关注用户体验和界面流畅性
一般情况下,Vue 是单线程,异步处理的,因为 JavaScript
语言本身就是单线程的。这主要源于浏览器的设计
你想想,操作...
单调队列之滑动窗口最值
问题
单调队列是一种很典型的问题,它能用来高效地解决 “滑动窗口最大值”
问题的数据结构
给定一个长度为 n 的数组 nums 和一个大小为 k
的滑动窗口,窗口从数组左端向右滑动,每次滑动一格,求每个窗口内的最大(小)值。
那么这种问题大概率其实下意识会想到用堆
如果是求最大值,但是如果使用大根堆,每次插入 O
(logk),但删除窗口左侧元素,也就是删除不在窗口内的堆顶的时候,需要 O
(n),整体 O (nlogk),仍不够高效。
P1886 滑动窗口
/【模板】单调队列 - 洛谷
P1886 滑动窗口
/【模板】单调队列
题目描述
有一个长为 n 的序列 a,以及一个大小为 k
的窗口。现在这个窗口从左边开始向右滑动,每次滑动一个单位,求出每次滑动后窗口中的最小值和最大值。
例如,对于序列 [1, 3, −1, −3, 5, 3, 6, 7] 以及 k = 3,有如下过程:
$$\def\arraystretch{1.2}
\begin{array}{|c|c|c|}\hline
\textsf{窗口位置} &...
动态规划—线性dp之编辑距离
问题
Levenshtein Distance,一般称为编辑距离(Edit Distance,Levenshtein
Distance只是编辑距离的其中一种)或者莱文斯坦距离,算法概念是俄罗斯科学家弗拉基米尔·莱文斯坦(Levenshtein
· Vladimir I)在1965年提出。此算法的概念很简单:Levenshtein
Distance指两个字串之间,由一个转换成另一个所需的最少编辑操作次数,允许的编辑操作包括:
将其中一个字符替换成另一个字符(Substitutions)。、
插入一个字符(Insertions)。
删除一个字符(Deletions)。
image-20251117195049889
问题分析
看上去就像是动态规划
那么考虑子问题,从 a[1...i] 到
b[1.....j]的编辑距离
那么我们就可以考虑这样一个状态变量
设 dp[i][j] 表示将字符串 a 的前
i 个字符(a[0..i-1])转换为字符串
b 的前...
在IDEA中如何进行各种调试及相关调试的技巧
前言
本文如题目,基于 IDEA,基于 Java,本来想用 Dart
来着,寻思了一下还是用更多人擅长的来讲吧
调试是个很牛逼的东西,因为你不能保证你能看懂代码抛出的每一个异常是什么意思,代码的每次编译错误都是什么问题,服务抛出的各种问题你都能找到位置
所以说,调试在越复杂的项目里面越实用。
貌似,jetbrain 家的IDE 都可以沿用类似的这一套调试流程和方法
进行调试之前,我们需要了解什么
还是先说一下 IDEA
中如何进行调试,我确实没特意看过这个内容,全是我自己摸索出来的,也顺便总结一下
首先,调试的情况分为如下类别
本地调试:最常见的调试方式,针对当前开发环境中运行的 Java
程序(如本地启动的 Spring Boot 应用、普通 Javamain
方法等)。代码和程序均在本地机器运行,调试器直接连接本地进程。
远程调试:针对运行在远程服务器(或其他机器)上的 Java
程序进行调试,本地 IDEA
通过网络连接远程进程。代码在本地,程序在远程运行,通过调试端口建立通信。
测试调试:针对...
动态规划—线性dp之最长公共子串
问题
继续 LCS 的问题考虑(本来是一篇文章,我感觉拆开好点)
问题又出现变化了,现在如果,我们要求求最长公共子串,也就是在 LCS
的基础上,要求连续
最长公共字串(LCStr)就是两个序列中连续且相同的最长子序列(区别于
LCS 的 “不要求连续”)
序列 A:"ABCBDAB"
序列 B:"BDCAB"
对比维度
最长公共子序列(LCS)
最长公共字串(LCStr)
核心要求
元素相对顺序一致,不要求连续
元素连续且相对顺序一致
示例结果
"BCAB"(长度 4)
"AB" 或 "BD"(长度 2)
问题本质
找 “有序不连续” 的最长交集
找 “有序且连续” 的最长交集
那么问题就被定义为,给定两个字符串 S(长度 n)和 T(长度
m),找到它们之间长度最长的公共连续子串,输出其长度(若不存在则输出
0)。
image-20251116195531260
问题分析
根据 LCS 的基础,我们考虑动态规划
首先考虑状态定义
设 S 长度为...
动态规划之线性dp之最长公共子序列
问题
image-20251116192953141
问题分析
子序列是指从一个序列中删除部分元素(可以不删)后,剩余元素保持原有相对顺序形成的新序列(不要求连续)。
最长公共子序列,英文缩写为LCS(Longest Common
Subsequence)。其定义是,一个序列 S
,如果分别是两个或多个已知序列的子序列,且是所有符合此条件序列中最长的,则
S 称为已知序列的最长公共子序列。
LCS
问题是:给定两个序列(如字符串、数组),找出它们之间长度最长的公共子序列。
例如:
序列 a = "ABCBDAB",序列 b = "BDCAB"
它们的 LCS 是 "BCAB" 或 "BDAB",长度为
4。
LCS 的标准解法可以通过动态规划在相对高效的时间内解决
考虑这样的一个状态:
用 二维数组
f[i][j],表示,序列a的前i个元素与序列b的前j个元素的最长公共子序列长度。
那么现在问题就变成了考察末尾元素 a[i],b[j] 是否在公共的子序列中
根据 a[i] 和 b[j]...
JavaScript_part6—JQuery.md
什么是jQurey
简介
jQuery 是一个 JavaScript 函数库。
jQuery 是一个轻量级的”写的少,做的多”的 JavaScript 库。
jQuery 库包含以下功能:
HTML 元素选取
HTML 元素操作
CSS 操作
HTML 事件函数
JavaScript 特效和动画
HTML DOM 遍历和修改
AJAX
Utilities
使用 jQuery 库
jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery
函数。
可以通过下面的标记把 jQuery 添加到网页中:
123<head> <script type="text/javascript" src="jquery.js"></script></head>
共有两个版本的 jQuery
可供下载:一份是精简过的,另一份是未压缩的(供调试或阅读)。
这两个版本都可从 jQuery.com
下载。
Google 和...













