口言之,身必行之。

54 阅读1分钟

Vue3-hooks示例1

1.hooks.文件
import { ref, onMounted, onUnmounted } from 'vue'

/* 定义一个hooks */
export default function useHooks() {
    const width = ref(window.innerWidth);
    const height = ref(window.innerHeight);
    
    const updateResize = () => {
        width.value = window.innerWidth;
        height.value = window.innerHeight;
    }
   
    onMounted(() => {
        window.addEventListener('resize', updateResize);
    });
   
    onUnmounted(() => {
        window.removeEventListener('resize', updateResize);
    });
    
    return { width, height }
}
2.引入hooks.文件
/* 引入一个hooks */
import  useHooks  from './hooks';

let { width, height } = useHooks();