✨ vue2中数据绑定和 模板语法
This commit is contained in:
parent
6669791fd3
commit
e81e7f2528
|
@ -0,0 +1,173 @@
|
|||
# Vim相关命令
|
||||
|
||||
## 基本移动命令
|
||||
|
||||
| 命令 | 描述 |
|
||||
| -------- | -------------------------------- |
|
||||
| `h` | 向左移动 |
|
||||
| `j` | 向下移动 |
|
||||
| `k` | 向上移动 |
|
||||
| `l` | 向右移动 |
|
||||
| `w` | 移动到下一个单词开头 |
|
||||
| `W` | 移动到下一个单词开头(忽略符号) |
|
||||
| `b` | 移动到上一个单词开头 |
|
||||
| `B` | 移动到上一个单词开头(忽略符号) |
|
||||
| `e` | 移动到当前单词末尾 |
|
||||
| `E` | 移动到当前单词末尾(忽略符号) |
|
||||
| `0` | 移动到行首 |
|
||||
| `^` | 移动到行首第一个非空白字符 |
|
||||
| `$` | 移动到行尾 |
|
||||
| `gg` | 移动到文件开头 |
|
||||
| `G` | 移动到文件末尾 |
|
||||
| `:[n]` | 移动到第 n 行 |
|
||||
| `Ctrl+f` | 向下翻页 |
|
||||
| `Ctrl+b` | 向上翻页 |
|
||||
| `H` | 移动到屏幕顶部 |
|
||||
| `M` | 移动到屏幕中间 |
|
||||
| `L` | 移动到屏幕底部 |
|
||||
|
||||
---
|
||||
|
||||
## 插入模式
|
||||
|
||||
| 命令 | 描述 |
|
||||
| -------- | -------------------------- |
|
||||
| `i` | 在光标前插入 |
|
||||
| `a` | 在光标后插入 |
|
||||
| `I` | 在行首插入 |
|
||||
| `A` | 在行尾插入 |
|
||||
| `o` | 在当前行下方新建一行并插入 |
|
||||
| `O` | 在当前行上方新建一行并插入 |
|
||||
| `R` | 进入替换模式(覆盖字符) |
|
||||
| `Ctrl+h` | 删除前一个字符(退格键) |
|
||||
| `Ctrl+w` | 删除前一个单词 |
|
||||
| `Ctrl+u` | 删除到行首 |
|
||||
|
||||
---
|
||||
|
||||
## 编辑命令
|
||||
|
||||
| 命令 | 描述 |
|
||||
| -------- | -------------------- |
|
||||
| `x` | 删除当前字符 |
|
||||
| `X` | 删除前一个字符 |
|
||||
| `dd` | 删除当前行 |
|
||||
| `dw` | 删除到下一个单词开头 |
|
||||
| `db` | 删除到上一个单词开头 |
|
||||
| `d$` | 删除到行尾 |
|
||||
| `d^` | 删除到行首 |
|
||||
| `dG` | 删除到文件末尾 |
|
||||
| `dgg` | 删除到文件开头 |
|
||||
| `yy` | 复制当前行 |
|
||||
| `yw` | 复制到下一个单词开头 |
|
||||
| `y$` | 复制到行尾 |
|
||||
| `p` | 粘贴到光标后 |
|
||||
| `P` | 粘贴到光标前 |
|
||||
| `u` | 撤销 |
|
||||
| `Ctrl+r` | 重做 |
|
||||
| `.` | 重复上一次修改 |
|
||||
| `J` | 合并下一行到当前行 |
|
||||
| `>>` | 向右缩进 |
|
||||
| `<<` | 向左缩进 |
|
||||
| `==` | 自动缩进当前行 |
|
||||
|
||||
---
|
||||
|
||||
## 搜索与替换
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ---------------- | ------------------------ |
|
||||
| `/pattern` | 向前搜索 pattern |
|
||||
| `?pattern` | 向后搜索 pattern |
|
||||
| `n` | 下一个匹配项 |
|
||||
| `N` | 上一个匹配项 |
|
||||
| `:%s/old/new/g` | 全局替换 old 为 new |
|
||||
| `:%s/old/new/gc` | 全局替换,每次确认 |
|
||||
| `:s/old/new/g` | 当前行替换 |
|
||||
| `*` | 向前搜索当前光标下的单词 |
|
||||
| `#` | 向后搜索当前光标下的单词 |
|
||||
| `:noh` | 临时取消搜索高亮 |
|
||||
|
||||
---
|
||||
|
||||
## 可视模式(选择文本)
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ---------------- | ------------------------------ |
|
||||
| `v` | 进入字符可视模式(按字符选择) |
|
||||
| `V` | 进入行可视模式(按行选择) |
|
||||
| `Ctrl+v` | 进入块可视模式(矩形选择) |
|
||||
| `ggVG` 或 `ggvG` | **全选**整个文件 |
|
||||
| `o` | 切换选择的光标端 |
|
||||
| `y` | 复制选中内容 |
|
||||
| `d` | 删除(剪切)选中内容 |
|
||||
| `c` | 修改(删除并进入插入模式) |
|
||||
| `~` | 切换选中内容的大小写 |
|
||||
|
||||
---
|
||||
|
||||
## 窗口管理
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ------------- | -------------- |
|
||||
| `:sp [file]` | 水平分割窗口 |
|
||||
| `:vsp [file]` | 垂直分割窗口 |
|
||||
| `Ctrl+w h` | 移动到左侧窗口 |
|
||||
| `Ctrl+w j` | 移动到下方窗口 |
|
||||
| `Ctrl+w k` | 移动到上方窗口 |
|
||||
| `Ctrl+w l` | 移动到右侧窗口 |
|
||||
| `Ctrl+w w` | 循环切换窗口 |
|
||||
| `Ctrl+w c` | 关闭当前窗口 |
|
||||
| `Ctrl+w o` | 只保留当前窗口 |
|
||||
| `Ctrl+w +` | 增加窗口高度 |
|
||||
| `Ctrl+w -` | 减少窗口高度 |
|
||||
| `Ctrl+w >` | 增加窗口宽度 |
|
||||
| `Ctrl+w <` | 减少窗口宽度 |
|
||||
| `Ctrl+w =` | 均衡窗口尺寸 |
|
||||
|
||||
---
|
||||
|
||||
## 标签页
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ---------------- | --------------------- |
|
||||
| `:tabnew [file]` | 新建标签页 |
|
||||
| `gt` | 下一个标签页 |
|
||||
| `gT` | 上一个标签页 |
|
||||
| `:tabclose` | 关闭当前标签页 |
|
||||
| `:tabonly` | 关闭其他标签页 |
|
||||
| `:tabmove [n]` | 移动标签页到第 n 位置 |
|
||||
|
||||
---
|
||||
|
||||
## 文件操作
|
||||
|
||||
| 命令 | 描述 |
|
||||
| -------------- | -------------------------- |
|
||||
| `:e file` | 打开文件 |
|
||||
| `:w` | 保存文件 |
|
||||
| `:w file` | 另存为 file |
|
||||
| `:q` | 退出 |
|
||||
| `:q!` | 强制退出不保存 |
|
||||
| `:wq` | 保存并退出 |
|
||||
| `:x` | 保存并退出(仅当有修改时) |
|
||||
| `:saveas file` | 另存为 file |
|
||||
| `:r file` | 插入文件内容到当前位置 |
|
||||
| `:r !command` | 插入命令输出到当前位置 |
|
||||
|
||||
---
|
||||
|
||||
## 其他实用命令
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ----------------- | --------------------------------------- |
|
||||
| `:set nu` | 显示行号 |
|
||||
| `:set nonu` | 隐藏行号 |
|
||||
| `:set hlsearch` | 高亮搜索结果 |
|
||||
| `:set nohlsearch` | 取消高亮搜索结果 |
|
||||
| `:set paste` | 进入粘贴模式(防止自动缩进) |
|
||||
| `:set nopaste` | 退出粘贴模式 |
|
||||
| `:!command` | 执行外部命令 |
|
||||
| `:help` | 打开帮助文档 |
|
||||
| `Ctrl+g` | 显示当前文件信息 |
|
||||
| `:%!command` | 用命令处理整个文件(如 `:%!sort` 排序) |
|
60
Vim/vim1.md
60
Vim/vim1.md
|
@ -1,60 +0,0 @@
|
|||
## **1. 基础移动(Navigation)**
|
||||
- **字符移动**:
|
||||
- `h` ← / `j` ↓ / `k` ↑ / `l` →
|
||||
- 方向键也能用,但 Vim 提倡用 `hjkl` 保持手不离键盘。
|
||||
- **单词移动**:
|
||||
- `w` → 跳到下一个单词开头
|
||||
- `b` ← 跳到上一个单词开头
|
||||
- `e` → 跳到当前单词末尾
|
||||
- **行内跳转**:
|
||||
- `0` 跳到行首,`^` 跳到第一个非空字符
|
||||
- `$` 跳到行尾
|
||||
- `f<char>` 向后搜索字符(如 `fa` 跳到下一个 `a`)
|
||||
- **屏幕移动**:
|
||||
- `Ctrl + u` 上翻半屏,`Ctrl + d` 下翻半屏
|
||||
- `gg` 跳到文件开头,`G` 跳到文件末尾
|
||||
- `:<行号>` 跳转到指定行(如 `:42` 跳到第 42 行)
|
||||
|
||||
---
|
||||
|
||||
## **2. 编辑文本(Editing)**
|
||||
- **插入模式**:
|
||||
- `i` 在光标前插入
|
||||
- `a` 在光标后插入
|
||||
- `I` 在行首插入,`A` 在行尾插入
|
||||
- `o` 在下一行插入,`O` 在上一行插入
|
||||
- **删除**:
|
||||
- `x` 删除当前字符
|
||||
- `dw` 删除一个单词
|
||||
- `dd` 删除整行
|
||||
- `D` 删除从光标到行尾
|
||||
- **复制/粘贴**:
|
||||
- `yy` 复制当前行
|
||||
- `p` 粘贴到光标后,`P` 粘贴到光标前
|
||||
- `yiw` 复制当前单词
|
||||
- **撤销/重做**:
|
||||
- `u` 撤销
|
||||
- `Ctrl + r` 重做
|
||||
|
||||
---
|
||||
|
||||
## **3. 选择与可视化模式(Visual Mode)**
|
||||
- `v` 进入字符选择模式
|
||||
- `V` 进入行选择模式
|
||||
- `Ctrl + v` 进入块选择模式(适合多行编辑)
|
||||
- 选中后可以用 `d`(删除)、`y`(复制)、`>`(缩进)等操作
|
||||
|
||||
---
|
||||
|
||||
## **4. 搜索与替换(Search & Replace)**
|
||||
- `/` + 关键词 → 搜索(`n` 下一个,`N` 上一个)
|
||||
- `:%s/old/new/g` → 全局替换(`g` 表示所有匹配)
|
||||
- `*` 快速搜索当前光标下的单词
|
||||
|
||||
---
|
||||
|
||||
## **5. 组合命令(Power Moves)**
|
||||
- `di"` → 删除引号内的内容
|
||||
- `ciw` → 修改当前单词
|
||||
- `dt<char>` → 删除直到某个字符(如 `dt)` 删除到 `)`)
|
||||
- `.` → 重复上一次操作
|
109
Vim/vim2.md
109
Vim/vim2.md
|
@ -1,109 +0,0 @@
|
|||
## 基本移动命令
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ------ | -------------------------- |
|
||||
| `h` | 向左移动 |
|
||||
| `j` | 向下移动 |
|
||||
| `k` | 向上移动 |
|
||||
| `l` | 向右移动 |
|
||||
| `w` | 移动到下一个单词开头 |
|
||||
| `b` | 移动到上一个单词开头 |
|
||||
| `e` | 移动到当前单词末尾 |
|
||||
| `0` | 移动到行首 |
|
||||
| `^` | 移动到行首第一个非空白字符 |
|
||||
| `$` | 移动到行尾 |
|
||||
| `gg` | 移动到文件开头 |
|
||||
| `G` | 移动到文件末尾 |
|
||||
| `:[n]` | 移动到第 n 行 |
|
||||
|
||||
## 插入模式
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ---- | -------------------------- |
|
||||
| `i` | 在光标前插入 |
|
||||
| `a` | 在光标后插入 |
|
||||
| `I` | 在行首插入 |
|
||||
| `A` | 在行尾插入 |
|
||||
| `o` | 在当前行下方新建一行并插入 |
|
||||
| `O` | 在当前行上方新建一行并插入 |
|
||||
|
||||
## 编辑命令
|
||||
|
||||
| 命令 | 描述 |
|
||||
| -------- | -------------------- |
|
||||
| `x` | 删除当前字符 |
|
||||
| `dd` | 删除当前行 |
|
||||
| `dw` | 删除到下一个单词开头 |
|
||||
| `d$` | 删除到行尾 |
|
||||
| `d^` | 删除到行首 |
|
||||
| `yy` | 复制当前行 |
|
||||
| `p` | 粘贴 |
|
||||
| `u` | 撤销 |
|
||||
| `Ctrl+r` | 重做 |
|
||||
| `.` | 重复上一次修改 |
|
||||
|
||||
## 搜索与替换
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ---------------- | ------------------- |
|
||||
| `/pattern` | 向前搜索 pattern |
|
||||
| `?pattern` | 向后搜索 pattern |
|
||||
| `n` | 下一个匹配项 |
|
||||
| `N` | 上一个匹配项 |
|
||||
| `:%s/old/new/g` | 全局替换 old 为 new |
|
||||
| `:%s/old/new/gc` | 全局替换,每次确认 |
|
||||
|
||||
## 可视模式
|
||||
|
||||
| 命令 | 描述 |
|
||||
| -------- | ---------------- |
|
||||
| `v` | 进入字符可视模式 |
|
||||
| `V` | 进入行可视模式 |
|
||||
| `Ctrl+v` | 进入块可视模式 |
|
||||
|
||||
## 窗口管理
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ------------- | -------------- |
|
||||
| `:sp [file]` | 水平分割窗口 |
|
||||
| `:vsp [file]` | 垂直分割窗口 |
|
||||
| `Ctrl+w h` | 移动到左侧窗口 |
|
||||
| `Ctrl+w j` | 移动到下方窗口 |
|
||||
| `Ctrl+w k` | 移动到上方窗口 |
|
||||
| `Ctrl+w l` | 移动到右侧窗口 |
|
||||
| `Ctrl+w c` | 关闭当前窗口 |
|
||||
| `Ctrl+w o` | 只保留当前窗口 |
|
||||
|
||||
## 标签页
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ---------------- | -------------- |
|
||||
| `:tabnew [file]` | 新建标签页 |
|
||||
| `gt` | 下一个标签页 |
|
||||
| `gT` | 上一个标签页 |
|
||||
| `:tabclose` | 关闭当前标签页 |
|
||||
|
||||
## 文件操作
|
||||
|
||||
| 命令 | 描述 |
|
||||
| --------- | -------------- |
|
||||
| `:e file` | 打开文件 |
|
||||
| `:w` | 保存文件 |
|
||||
| `:w file` | 另存为 file |
|
||||
| `:q` | 退出 |
|
||||
| `:q!` | 强制退出不保存 |
|
||||
| `:wq` | 保存并退出 |
|
||||
| `:x` | 保存并退出 |
|
||||
|
||||
## 其他实用命令
|
||||
|
||||
| 命令 | 描述 |
|
||||
| ----------------- | --------------------------------- |
|
||||
| `*` | 搜索当前光标下的单词 |
|
||||
| `#` | 反向搜索当前光标下的单词 |
|
||||
| `:%!command` | 将当前缓冲区内容通过 command 过滤 |
|
||||
| `:r!command` | 将 command 的输出插入到当前位置 |
|
||||
| `:set nu` | 显示行号 |
|
||||
| `:set nonu` | 隐藏行号 |
|
||||
| `:set hlsearch` | 高亮搜索结果 |
|
||||
| `:set nohlsearch` | 取消高亮搜索结果 |
|
|
@ -69,6 +69,5 @@
|
|||
<groupId>org.springframework.cloud</groupId>
|
||||
<artifactId>spring-cloud-starter-loadbalancer</artifactId>
|
||||
</dependency>
|
||||
|
||||
</dependencies>
|
||||
</project>
|
||||
|
|
|
@ -7,7 +7,6 @@ import org.springframework.web.bind.annotation.GetMapping;
|
|||
import org.springframework.web.bind.annotation.PathVariable;
|
||||
|
||||
// Feign 客户端
|
||||
// @FeignClient(value = "service-product", path = "/api/product", fallback = ProductFeignClientFallback.class)
|
||||
@FeignClient(value = "gateway", path = "/api/product", fallback = ProductFeignClientFallback.class)
|
||||
public interface ProductFeignClient {
|
||||
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -13,19 +13,6 @@
|
|||
<version>0.0.1-SNAPSHOT</version>
|
||||
<name>mq-demo</name>
|
||||
<description>mq-demo</description>
|
||||
<url/>
|
||||
<licenses>
|
||||
<license/>
|
||||
</licenses>
|
||||
<developers>
|
||||
<developer/>
|
||||
</developers>
|
||||
<scm>
|
||||
<connection/>
|
||||
<developerConnection/>
|
||||
<tag/>
|
||||
<url/>
|
||||
</scm>
|
||||
|
||||
<properties>
|
||||
<java.version>17</java.version>
|
||||
|
|
|
@ -3,26 +3,28 @@ package cn.bunny.mq.mqdemo.mq.listener;
|
|||
import com.rabbitmq.client.Channel;
|
||||
import lombok.extern.slf4j.Slf4j;
|
||||
import org.springframework.amqp.core.Message;
|
||||
import org.springframework.amqp.rabbit.annotation.RabbitListener;
|
||||
import org.springframework.amqp.rabbit.annotation.*;
|
||||
import org.springframework.stereotype.Component;
|
||||
|
||||
import java.io.IOException;
|
||||
|
||||
import static cn.bunny.mq.mqdemo.domain.RabbitMQMessageListenerConstants.*;
|
||||
|
||||
@Component
|
||||
@Slf4j
|
||||
public class MessageListenerOrder {
|
||||
|
||||
// /* 测试这个,需要注释下main那个 */
|
||||
// @RabbitListener(bindings = @QueueBinding(
|
||||
// exchange = @Exchange(value = EXCHANGE_DIRECT),
|
||||
// value = @Queue(value = QUEUE_NAME, durable = "true"),
|
||||
// key = ROUTING_KEY_DIRECT,
|
||||
// arguments = @Argument(name = "alternate-exchange", value = ALTERNATE_EXCHANGE_BACKUP)
|
||||
// )
|
||||
// )
|
||||
// public void processMessage(String dataString, Message message, Channel channel) {
|
||||
// System.out.println("消费端接受消息:" + dataString);
|
||||
// }
|
||||
/* 测试这个,需要注释下main那个 */
|
||||
@RabbitListener(bindings = @QueueBinding(
|
||||
exchange = @Exchange(value = EXCHANGE_DIRECT),
|
||||
value = @Queue(value = QUEUE_NAME, durable = "true"),
|
||||
key = ROUTING_KEY_DIRECT,
|
||||
arguments = @Argument(name = "alternate-exchange", value = ALTERNATE_EXCHANGE_BACKUP)
|
||||
)
|
||||
)
|
||||
public void processMessage(String dataString, Message message, Channel channel) {
|
||||
System.out.println("消费端接受消息:" + dataString);
|
||||
}
|
||||
|
||||
// /* 如果测试这个需要注释上面那个 */
|
||||
// @RabbitListener(queues = {QUEUE_NAME})
|
||||
|
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<script src="js/vue@2.7.16.js"></script>
|
||||
<title>模板语法</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<h1>插值语法</h1>
|
||||
<h3>你好:{{name}}</h3>
|
||||
<br />
|
||||
|
||||
<h1>指令语法</h1>
|
||||
<a :href="url" target="_blank">v2.cn.vuejs.org</a>
|
||||
|
||||
<!-- v-bind 可以省略 -->
|
||||
<a v-bind:href="url" target="_blank">v2.cn.vuejs.org</a>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data: {
|
||||
name: "Bunny",
|
||||
url: "https://v2.cn.vuejs.org/"
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
</html>
|
|
@ -0,0 +1,64 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<script src="js/vue@2.7.16.js"></script>
|
||||
<title>数据绑定</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
单项数据绑定:<input type="text" v-bind:value="name">
|
||||
双向数据绑定:<input type="text" v-model="name">
|
||||
</div>
|
||||
|
||||
<div id="root">
|
||||
2秒后绑定到这个上
|
||||
单项数据绑定:<input type="text" v-bind:value="name">
|
||||
双向数据绑定:<input type="text" v-model="name">
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
// 只要vm有的内容都可以用
|
||||
const v = new Vue({
|
||||
// el: "#app",
|
||||
// data: {
|
||||
// name: "数据绑定"
|
||||
// },
|
||||
|
||||
// 不能用箭头函数
|
||||
// data: function () {
|
||||
// return {
|
||||
// name: "数据绑定"
|
||||
// }
|
||||
// }
|
||||
data() {
|
||||
return {
|
||||
name: "数据绑定"
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 下面内容可以简写成 v-if形式
|
||||
setTimeout(() => {
|
||||
v.$mount("#app");
|
||||
console.log("app");
|
||||
}, 1000);
|
||||
|
||||
setTimeout(() => {
|
||||
// 正确做法:销毁旧实例,创建新实例
|
||||
v.$destroy();
|
||||
|
||||
const v2 = new Vue({
|
||||
data: {
|
||||
name: "新数据绑定"
|
||||
}
|
||||
});
|
||||
v2.$mount("#root");
|
||||
console.log("root");
|
||||
}, 2000);
|
||||
</script>
|
||||
|
||||
</html>
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue