vue3-基础知识（3）- 侦听器 - 码农知识堂

vue3-基础知识（3）- 侦听器
1. 处理副作用。默认情况下，用户创建的侦听器回调，都会在 Vue 组件更新之前被调用。
2. watchEffect
  立即执行，自动追踪函数内部依赖，变化则再次执行。
- watchEffect(fn) // 请求数据，从新请求。
- 代码简洁，但关系不明确。
1. watch
  懒依赖，精确控制。
- watch(ref,fn) // 一个ref
- watch(() => ref1.value + ref2.value, fn) // 多个ref组合值
- watch([ref1, ref2], fn) // 多个ref
- watch(() => reactive.props, fn) // reactive属性，深层嵌套（推荐）
- watch(() => reactive.props, fn, { deep: true }) // 强制深层（慎用）。
1. 回调中访问更新后的dom
- 需要指明 flush: ‘post’
- 用后置刷新watchPostEffect替代
1. 停止侦听器
  
  侦听器必须用同步语句创建（会自动停止）：如果用异步回调创建一个侦听器，那么它不会绑定到当前组件上，你必须手动停止它，以防内存泄漏
- 手动停止侦听器: const unWatch = watchEffect(() => {}); unWatch()
1. 异步侦听器（推荐）
```
    // 需要异步请求得到的数据
  const data = ref(null)

  watchEffect(() => {
    if (data.value) {
      // 数据加载后执行某些操作...
    }
  })
1
2
3
4
5
6
7
8
```
相关阅读:
开发工程师必备————【Day15】python操作Mysql及SQL语法补充
 bootstrap-table固定左侧列+表头和内容对齐
 Go——数组
 VD6283TX环境光传感器驱动开发(4)----移植闪烁频率代码
 【PyQt5 实战项目1】武汉大学建筑知识系统--思路分享2（软件版本1.0.0介绍之打开图片）
webpack做HTTP压缩
 文件管理：文件存储空间管理
 【Django-DRF】多年md笔记第5篇：Django-DRF的Request、Response和视图详解
 007.iSCSI服务器CHAP双向认证配置
 同一项目、不同版本之间源码的阅读
原文地址：https://blog.csdn.net/junjiahuang/article/details/127921743