vue3 hook,vue hooks

　　本文主要介绍了vue3中的钩子总结，有很好的参考价值。希望对你有帮助。如有错误或不足之处，请不吝赐教。

目录

　　 Hook vue 3 Hook vue 3汇总计数器的自定义挂钩

vue3的hooks总结

　　vue3中的Hooks其实就是函数的编写，就是把文件的个别函数的一些js代码提取出来放到单独的js文件中。其实这和我们vue2中学的mixin差不多。下面总结一下如何写钩子。

　　你应该首先建立一个钩子文件夹：它的目的是存储钩子文件。

　　创建相关的钩子文件：一般使用开头。

计数器的hook

　　头衔的挂钩

　　UseScrollPostion用于监视浏览器页面的滚动。

　　使用Mousemove监听鼠标位置的钩子。

　　UseLocalStorage可以存储在本地。

vue3自定义hooks

　　自定义钩子和组件一样，只封装js。当一段js代码需要重用时，可以封装到一个钩子中重用。在另一页插入一个钩子，记录鼠标点击的坐标。您可以在文件中创建一个专用于编写钩子的文件夹，它可以与component处于同一级别。

　　编写要在这个js文件中重用的代码。

　　从“@vue/reactivity”导入{ reactive }

　　从“vue”导入{onMounted}

　　导出默认函数(){

　　让积分=无功({

　　x:0，

　　y:0

　　})

　　函数myclick(事件){

　　points.x=event.pageX

　　points.y=event.pageY

　　}

　　onMounted(()={

　　//单击窗口，所以为窗口定义Click事件。

　　window.addEventListener(click ，myclick)

　　})

　　//这里需要有一个返回值。如果您没有收到返回值的函数，您会收到一个undefind。

　　返回点

　　}

　　编写完钩子文件后，可以在其他地方引用它(可以和其他代码一起编写)。

　　以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。