Vue3 hook 函数模块化 类似vue2 mixin

1、优点

代码功能模块化，复用代码

2、建立

新建hooks文件夹，在src下

src/hooks/use功能.js

3、案例

a、模块化

src/hooks/usepoint.js

import { reactive, onMounted, onBeforeUnmount} from 'vue';export default function(){let ponint = reactive({x: 0,y: 0})function getPoint(event){ponint.x = event.clientXponint.y = event.clientYconsole.log(ponint.x, ponint.y)}// 挂载该组件时，增加监听onMounted(() => {document.addEventListener('click',  getPoint)})// 卸载该组件是，关闭监听onBeforeUnmount(() => {document.removeEventListener('click', getPoint)})return ponint}// export default getPonit

b、使用

// 引入
import getPoint from '../hooks/usepoint'
//使用
let point = getPoint()