初识Hooks

1.vue2中的mixin是什么

  • 将组件的公共逻辑或者配置提取出来,哪个组件需要用到时,直接将提取的这部分混入到组件内部即可。这样既可以减少代码冗余度,也可以让后期维护起来更加容易。提取的是逻辑或配置,而不是HTML代码和CSS代码。

2.mixin与vuex的区别?

  • vuex公共状态管理,如果在一个组件中更改了Vuex中的某个数据,那么其它所有引用了Vuex中该数据的组件也会跟着变化。mixin中的数据和方法都是独立的,组件之间使用后是互相不影响的。

3.vue2中的mixin与vue3中的hooks

  • 相对于vue2的mixin而言:hooks将mixin拆分了,将导入的操作交给了开发者,以前是vue直接帮我们把数据合并在了一起,反而导致了数据无从溯源的问题。

4.hooks例子

//例子:
import { ref, onMounted, onUnmounted } from "vue";
export function use***() {
	//逻辑实现
 return {
      
    }
}
export default use***

//组件中使用
import { use*** } from "./mouse";
export default {
  setup() {
    const ** = use***();
    return { x, y };
  },
};
posted @ 2024-08-04 14:09  Frommoon  阅读(6)  评论(0编辑  收藏  举报