Vue3的hook函数,相当于vue2的 mixin,不同在于hooks是函数。
Vue3的hook函数,可以帮助我们提高代码的复用性, 让我们能在不同的组件中都利用 hooks 函数。
例子:将鼠标点击页面就获取坐标点的方法拿出独立,便于其他组件复用。
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/0b513fb9111442239fba8285d5e4a6f0.png)
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/c62eef9b27064eb39f4ddb976bde61c5.png)
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/80edac45519c42129acb87856dfdf6db.png)
toRef
作用:创建一个ref对象,其value值指向另一个对象中的某个属性。
语法:const name = toRef(device,’name’).
应用:要将响应式对象中的某个属性单独提供给外部使用时。
扩展:toRefs和toRef功能一样,但是可以创建多个ref对象,语法:toRefs(device)。
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/7320991583eb402a8c49e3ab46d9c005.png)