常用的JavaScript设计模式
-
单体模式
-
工厂模式
-
例模式
函数
-
函数的定义
-
局部变量和全局变量
-
返回值
-
匿名函数
-
自运行函数
-
闭包
-
参数2:回调函数
-
参数3:配置
作用
监视指定的一个或多个响应式数据, 一旦数据变化, 就自动执行监视回调
默认初始时不执行回调, 但可以通过配置immediate为true, 来指定初始时立即执行第一次
通过配置deep为true, 来指定深度监视
import { watch, ref } from 'vue'; // 引入
const user = reactive({
firstName: '孙',
lastName: '志豪',
});
const fullName3 = ref('');
watch( // vue3 监听函数的写法
() => user, // 监听的数据
({ firstName, lastName }) => { // 数据变动执行的函数
fullName3.value = firstName + '_' + lastName;
},
{ immediate: true, deep: true } // 深度监听 和 第一次加载页面执行一次
);
return {
user,
fullName3,
};
watch监听多个数据,使用数组
watch监听非响应式数据的时候需要使用回调函数的形式
watch([()=>user.firstName,()=>user.lastName,fullName3],()=>{console.log('我执行了')})
//第一个参数写成数组的形式
watchEffect函数:
==============
作用
监视数据发生变化时执行回调，不用直接指定要监视的数据, 回调函数中使用的哪些响应式数据就监视哪些响应式数据，默认初始时就会执行第一次, 从而可以收集需要监视的数据。
import { watchEffect, ref } from 'vue';
const user = reactive({
firstName: '孙',
lastName: '志豪',
});
const fullName4 = ref('');
watchEffect(() => {
最后
全网独播-价值千万金融项目前端架构实战
从两道网易面试题-分析JavaScript底层机制
RESTful架构在Nodejs下的最佳实践
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
一线互联网企业如何初始化项目-做一个自己的vue-cli
思维无价，看我用Nodejs实现MVC
代码优雅的秘诀-用观察者模式深度解耦模块
前端高级实战，如何封装属于自己的JS库
VUE组件库级组件封装-高复用弹窗组件
