customRef

MagnumHou 2023-03-03 11:28:07

课时名称	课时知识点
customRef	customRefcustomRefcustomRefcustomRefcustomRef

...全文

46 回复打赏收藏转发到动态举报

写回复

回复

切换为时间正序

请发表友善的回复…

发表回复

内容概要：本文深入介绍了Vue3的Composition API及其新特性。首先讨论了浅响应式的两个重要API——shallowReactive与shallowRef的应用场景，分别适用于对对象外层属性和基本数据类型进行响应式处理的情况。接着介绍了如何使响应式数据变成只读（readonly）或仅外层只读（shallowReadonly）。随后讲述了toRaw与markRaw用于处理不需要响应的数据或第三方类库，以提高性能。另外详细解析了customRef自定义响应规则，以及provide和inject机制实现祖孙组件间的数据共享。还简述了Vue3带来的其他改变，如Fragment、Teleport、Suspense、异步组件的改进、事件监听及过渡效果的调整等。并对比Composition API和Option API，前者更好地支持代码复用性和 TypeScript 的类型推断。适用人群：熟悉Vue2基础知识的开发者，特别是准备转向Vue3的前端开发工程师。使用场景及目标：帮助前端开发者深入理解Composition API的具体功能和实现，适应新的编码规范，充分利用Vue3的

下面只是目标目录 20_嵌套路由.mp4 121_路由的query参数.mp4 122_命名路由.mp4 123_路由的params参数.mp4 124_路由的props配置.mp4 125_router-link的replace属性.mp4 126_编程式路由导航.mp4 127_缓存路由组件.mp4 128_两个新的生命周期钩子.mp4 129_全局前置_路由守卫.mp4 130_全局后置_路由守卫.mp4 131_独享路由守卫.mp4 132_组件内路由守卫.mp4 133_history模式与hash模式.mp4 134_element-ui基本使用.mp4 135_element-ui按需引入.mp4 136Vue3技术_vue3简介.mp4 137Vue3技术_使用vue-cli创建工程.mp4 138Vue3技术_使用vite创建工程.mp4 139Vue3技术_分析工程结构.mp4 140Vue3技术_安装开发者工具.mp4 141Vue3技术_初识setup.mp4 142Vue3技术_ref函数_处理基本类型.mp4 143Vue3技术_ref函数_处理对象类型.mp4 144Vue3技术_reactive函数.mp4 145Vue3技术_回顾Vue2的响应式原理.mp4 146Vue3技术_Vue3响应式原理_Proxy.mp4 147Vue3技术_Vue3响应式原理_Reflect.mp4 148Vue3技术_reactive对比ref.mp4 149Vue3技术_setup的两个注意点.mp4 150Vue3技术_computed计算属性.mp4 151Vue3技术_watch监视ref定义的数据.mp4 152Vue3技术_watch监视reactive定义的数据.mp4 153Vue3技术_watch时value的问题.mp4 154Vue3技术_watchEffect函数.mp4 155Vue3技术_Vue3生命周期.mp4 156Vue3技术_自定义hook.mp4 157Vue3技术_toRef与toRefs.mp4 158Vue3技术_shallowReactive与shallowRef.mp4 159Vue3技术_readonly与shallowReadonly.mp4 160Vue3技术_toRaw与markRaw.mp4 161Vue3技术_customRef.mp4 162Vue3技术_provide与inject.mp4 163Vue3技术_响应式数据的判断.mp4 164Vue3技术_CompositionAPI的优势.mp4 165Vue3技术_Fragment组件.mp4 166Vue3技术_Teleport组件.mp4 167Vue3技术_Suspense组件.mp4 168Vue3技术_Vue3中其他的改变.mp4 代码.zip 资料（含课件）.zip

下面只是目标目录 20_嵌套路由.mp4 121_路由的query参数.mp4 122_命名路由.mp4 123_路由的params参数.mp4 124_路由的props配置.mp4 125_router-link的replace属性.mp4 126_编程式路由导航.mp4 127_缓存路由组件.mp4 128_两个新的生命周期钩子.mp4 129_全局前置_路由守卫.mp4 130_全局后置_路由守卫.mp4 131_独享路由守卫.mp4 132_组件内路由守卫.mp4 133_history模式与hash模式.mp4 134_element-ui基本使用.mp4 135_element-ui按需引入.mp4 136Vue3技术_vue3简介.mp4 137Vue3技术_使用vue-cli创建工程.mp4 138Vue3技术_使用vite创建工程.mp4 139Vue3技术_分析工程结构.mp4 140Vue3技术_安装开发者工具.mp4 141Vue3技术_初识setup.mp4 142Vue3技术_ref函数_处理基本类型.mp4 143Vue3技术_ref函数_处理对象类型.mp4 144Vue3技术_reactive函数.mp4 145Vue3技术_回顾Vue2的响应式原理.mp4 146Vue3技术_Vue3响应式原理_Proxy.mp4 147Vue3技术_Vue3响应式原理_Reflect.mp4 148Vue3技术_reactive对比ref.mp4 149Vue3技术_setup的两个注意点.mp4 150Vue3技术_computed计算属性.mp4 151Vue3技术_watch监视ref定义的数据.mp4 152Vue3技术_watch监视reactive定义的数据.mp4 153Vue3技术_watch时value的问题.mp4 154Vue3技术_watchEffect函数.mp4 155Vue3技术_Vue3生命周期.mp4 156Vue3技术_自定义hook.mp4 157Vue3技术_toRef与toRefs.mp4 158Vue3技术_shallowReactive与shallowRef.mp4 159Vue3技术_readonly与shallowReadonly.mp4 160Vue3技术_toRaw与markRaw.mp4 161Vue3技术_customRef.mp4 162Vue3技术_provide与inject.mp4 163Vue3技术_响应式数据的判断.mp4 164Vue3技术_CompositionAPI的优势.mp4 165Vue3技术_Fragment组件.mp4 166Vue3技术_Teleport组件.mp4 167Vue3技术_Suspense组件.mp4 168Vue3技术_Vue3中其他的改变.mp4 代码.zip 资料（含课件）.zip

下面只是目标目录 20_嵌套路由.mp4 121_路由的query参数.mp4 122_命名路由.mp4 123_路由的params参数.mp4 124_路由的props配置.mp4 125_router-link的replace属性.mp4 126_编程式路由导航.mp4 127_缓存路由组件.mp4 128_两个新的生命周期钩子.mp4 129_全局前置_路由守卫.mp4 130_全局后置_路由守卫.mp4 131_独享路由守卫.mp4 132_组件内路由守卫.mp4 133_history模式与hash模式.mp4 134_element-ui基本使用.mp4 135_element-ui按需引入.mp4 136Vue3技术_vue3简介.mp4 137Vue3技术_使用vue-cli创建工程.mp4 138Vue3技术_使用vite创建工程.mp4 139Vue3技术_分析工程结构.mp4 140Vue3技术_安装开发者工具.mp4 141Vue3技术_初识setup.mp4 142Vue3技术_ref函数_处理基本类型.mp4 143Vue3技术_ref函数_处理对象类型.mp4 144Vue3技术_reactive函数.mp4 145Vue3技术_回顾Vue2的响应式原理.mp4 146Vue3技术_Vue3响应式原理_Proxy.mp4 147Vue3技术_Vue3响应式原理_Reflect.mp4 148Vue3技术_reactive对比ref.mp4 149Vue3技术_setup的两个注意点.mp4 150Vue3技术_computed计算属性.mp4 151Vue3技术_watch监视ref定义的数据.mp4 152Vue3技术_watch监视reactive定义的数据.mp4 153Vue3技术_watch时value的问题.mp4 154Vue3技术_watchEffect函数.mp4 155Vue3技术_Vue3生命周期.mp4 156Vue3技术_自定义hook.mp4 157Vue3技术_toRef与toRefs.mp4 158Vue3技术_shallowReactive与shallowRef.mp4 159Vue3技术_readonly与shallowReadonly.mp4 160Vue3技术_toRaw与markRaw.mp4 161Vue3技术_customRef.mp4 162Vue3技术_provide与inject.mp4 163Vue3技术_响应式数据的判断.mp4 164Vue3技术_CompositionAPI的优势.mp4 165Vue3技术_Fragment组件.mp4 166Vue3技术_Teleport组件.mp4 167Vue3技术_Suspense组件.mp4 168Vue3技术_Vue3中其他的改变.mp4 代码.zip 资料（含课件）.zip

下面只是目标目录 20_嵌套路由.mp4 121_路由的query参数.mp4 122_命名路由.mp4 123_路由的params参数.mp4 124_路由的props配置.mp4 125_router-link的replace属性.mp4 126_编程式路由导航.mp4 127_缓存路由组件.mp4 128_两个新的生命周期钩子.mp4 129_全局前置_路由守卫.mp4 130_全局后置_路由守卫.mp4 131_独享路由守卫.mp4 132_组件内路由守卫.mp4 133_history模式与hash模式.mp4 134_element-ui基本使用.mp4 135_element-ui按需引入.mp4 136Vue3技术_vue3简介.mp4 137Vue3技术_使用vue-cli创建工程.mp4 138Vue3技术_使用vite创建工程.mp4 139Vue3技术_分析工程结构.mp4 140Vue3技术_安装开发者工具.mp4 141Vue3技术_初识setup.mp4 142Vue3技术_ref函数_处理基本类型.mp4 143Vue3技术_ref函数_处理对象类型.mp4 144Vue3技术_reactive函数.mp4 145Vue3技术_回顾Vue2的响应式原理.mp4 146Vue3技术_Vue3响应式原理_Proxy.mp4 147Vue3技术_Vue3响应式原理_Reflect.mp4 148Vue3技术_reactive对比ref.mp4 149Vue3技术_setup的两个注意点.mp4 150Vue3技术_computed计算属性.mp4 151Vue3技术_watch监视ref定义的数据.mp4 152Vue3技术_watch监视reactive定义的数据.mp4 153Vue3技术_watch时value的问题.mp4 154Vue3技术_watchEffect函数.mp4 155Vue3技术_Vue3生命周期.mp4 156Vue3技术_自定义hook.mp4 157Vue3技术_toRef与toRefs.mp4 158Vue3技术_shallowReactive与shallowRef.mp4 159Vue3技术_readonly与shallowReadonly.mp4 160Vue3技术_toRaw与markRaw.mp4 161Vue3技术_customRef.mp4 162Vue3技术_provide与inject.mp4 163Vue3技术_响应式数据的判断.mp4 164Vue3技术_CompositionAPI的优势.mp4 165Vue3技术_Fragment组件.mp4 166Vue3技术_Teleport组件.mp4 167Vue3技术_Suspense组件.mp4 168Vue3技术_Vue3中其他的改变.mp4 代码.zip 资料（含课件）.zip

橙汐工作室

3

社区成员

332

社区内容

发帖

与我相关

我的任务

vue.js前端框架html5 企业社区天津·河西区

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

核心使命：为IT从业者和技术爱好者提供一个优质的学习、交流和分享平台，促进技术创新和成长。
注意事项：请保持尊重、友善的交流环境，遵守社区规则，禁止发布违法、侵权、低俗或有害信息。
激励机制：为了鼓励积极参与社区的用户，我们会设置积分和勋章系统，支持高质量的原创内容和有益的互动。
感谢您的加入，期待与您一起在CSDN社区共同探索技术，交流经验，共同成长！

试试用AI创作助手写篇文章吧

+ 用AI写文章