vue事件监听

我们可以使用 v-on 指令 (简写为 @) 来监听 DOM 事件，并在事件触发时执行对应的

---

1.回车事件（点击回车触发）

@confirm   适用uni-app 

@keyup.enter  适用vue3

运用场景：通常在文本框输入的时候使用

---

2.点击事件（鼠标左键点击指定区域触发）

@click 

运用场景：用户登陆，按钮点击

---

3.更改事件 （值更改触发）

@change

运用场景：通常用于文本框的值被修改的时候进行验证

---

4.失去焦点事件（鼠标点击之后视为聚焦，鼠标点击另一块区域视为失去焦点）

@blur

运用场景：通常用于文本框失去焦点后验证

---

5.获得焦点事件

@focus

运用场景：通常用于选中某些区域之后进行高亮提示

---

5.输入框内容变化事件

@input

运用场景：可以实现输入框输入后，下面动态生成相关内容

---

6.提交事件 （表单提交的时候触发）

@submit

运用场景

---

7.滚动事件 （滚动条滚动触发）

@scroll

运用场景

---

8.下拉刷新事件  （uni-app独有）

@pullingDown 

运用场景:数据刷新，加载更多

---

9.触底事件 （uni-app独有）

@reachingBottom

运用场景：可以加载更多的数据，触底提示是否回到顶部

---

 补充:

为什么使用v-for要定义  :key="" 

<view class="forBody" v-for="(item,index) in arrs" :key="item.id">
			
</view>

解释：

1.提高性能:

Vue 使用 key 来追踪每个节点的身份，这样就可以在更新列表时更高效地复用和重新排序现有元素，而不是每次都重新渲染整个列表。这有助于减少不必要的DOM操作，从而提高性能。

2.避免警告：

如果不为每个项指定唯一的 key，Vue 会发出警告，提示你添加 key。这是因为没有 key 会导致渲染问题，尤其是在涉及到状态管理或者动画效果时。

3.确保状态：

当列表中的数据发生变化时，Vue 会根据 key 的唯一性来判断哪些元素需要更新或移动。如果没有提供 key 或者提供的 key 不唯一，则可能导致组件状态混乱，例如计数器或其他动态数据可能不会按预期工作

因此，在使用 v-for 时，推荐为每个项提供一个唯一的 key 值，以确保正确的渲染行为和最佳性能。