vue3 自定义hook 函数

作用类似于vue2中的mixin技术

案例：获取鼠标点击页面的坐标

1.在src下建hooks文件夹，用于存放复用的js

2.src/hooks/usePoints.js文件中写复用的部分

import { reactive, onMounted, onBeforeUnmount } from 'vue'
export default function () {
    let point = reactive({
        x: 0,
        y: 0
    })
    function savePoint(event) {
        point.x = event.pageX
        point.y = event.pageY
        console.log(event.pageX, event.pageY)
    }
    onMounted(() => {
        window.addEventListener('click', savePoint)
    })
    onBeforeUnmount(() => {
        window.removeEventListener('click', savePoint)
    })
    return point  //注意将point传出去
}

 3.要复用的页面