位置:- 正文

VueUse(中文)——简介(vueity)

编辑:rootadmin
VueUse(中文)——简介 一、VueUse——简介VueUse是由Anthony Fu等大佬写的基于Vue的自定义钩子集合。类似于基于React的 ahooks功能丰富:200+功能无缝迁移:适用于Vue 3和Vue2.7版本之后支持tree shaking:只引入自己需要的那部分,打包会更小还有其他的亮点,可以去官网查看二、VueUse——快速开始VueUse是一个基于Composition API的实用函数集合。所以需要熟悉 Composition API 的基本概念1、安装下载包的方式

推荐整理分享VueUse(中文)——简介(vueity),希望有所帮助,仅作参考,欢迎阅读内容。

VueUse(中文)——简介(vueity)

文章相关热门搜索词:vue usestore,vue.use(vuerouter),vue.use(vuex),vue!,useswr vue,vue.use(vuex),vue.use(vuex),vueuse有什么用,内容如对您有帮助,希望把文章链接给更多的朋友!

npm i @vueuse/core

CDN 引入方式<script src="https://unpkg.com/@vueuse/shared"></script><script src="https://unpkg.com/@vueuse/core"></script>2、使用方法

三、最优的使用方法1、解构VueUse中的大多数函数都返回一个refs对象,你可以使用ES6的对象解构语法来获取你需要的: 如果你不喜欢.value的使用方式,你可以使用reactive()来包裹返回的refs对象: 2、清除副作用类似于Vue的watch 和computed ,当组件卸载时将被处理掉,VueUse的功能也会自动清除副作用。例如:useEventListener,当组件销毁时候,会自动调用removeEventListener 来进行处理,无需手动处理。 所有的VueUse函数都遵循这个约定。为了方便我们可以手动处理这些函数,一些函数返回一个stop处理程序: 虽然不是所有函数都返回处理程序,但更通用的解决方案是使用Vue中的 effectScope API。 3、传递Ref作为参数在Vue中,我们使用setup()函数来构建数据和逻辑之间的“连接”。为了使它更灵活,大多数VueUse函数也接受参数的ref版本。规范使用的方式:通常useTitle返回一个反映页面标题的ref。当你给ref赋新值时,它会自动更新标题。 连接使用的方式:如果你认为有“关联”,你可以传递一个ref,使它绑定到页面的标题。 Reactive Getter方式:从VueUse 9.0开始,引入了一个新的方式来传递“Reactive Getter”作为参数。
本文链接地址:https://www.jiuchutong.com/zhishi/296139.html 转载请保留说明!
下一篇链接:https://www.jiuchutong.com/zhishi/296140.html
免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

鄂ICP备2023003026号

友情链接: 武汉网站建设 电脑维修 湖南楚通运网络