在vue2的时候重复逻辑的代码可以使用mixin在组件实例中重复使用吗

软件 2023-07-05

vue什么情况下使用mixins

1 一般在vue中，有很多vue组件，这些组件每个都是一个文件。都可能需要引用到相同模块(或者插件)。我们不想每个文件都import 一次模块。如果是基于vue.js编写的插件我们可以用 Vue.use(...) main.js 2 但是如果想添加一个全局命令，同时又让每个vue的文件都能用到怎么办？第一步：最好建立一个全局的命令文件例如：directive/directive.js 第二步：利用Vue.directive()建立一个全局命令，并将它暴露出来，例如一个focus 让表单自动聚焦 directive.js 第三部步：在main.js（入口JS文件）中将它引入，可以省略文件后缀

vue2和vue3区别面试题

1、vue2相较vue3代码可读性比较差。vue2中选项API格式的代码的可读性较差，当需要实现的某一个功能涉及到多个属性的时候，就会出现在

props中接收参数
在data中定义变量
在watch中监听变化
在computed中定义需要使用到的计算属性
在methods中定义事件响应方法

对相同数据操作的代码会被分隔到各个属性内，不利于阅读代码。而vue3的组合式API对这一缺点进行了优化，使用组合式API能够将我们想要关联的代码放到一个组合里，增加了代码的可读性和可维护性。

2、vue2使用的API中使我们的代码大量的使用了this，不利于代码逻辑的复用。而vue3使用的组合式API在涉及到跨组件之间提取，复用逻辑时，会非常的灵活。且Vue3中的composition API对类型推导很友好，对于TS的兼容性更高。

3、Vue2需要对每个对象的每个属性进行遍历，当对象的属性还是对象时，需要递归监听，影响性能。对于已创建的实例不允许动态添加根级别的响应式属性，不具备监听数组的能力。而vue3可以监听原生数组并监听对象属性的动态添加和删除。

vue组件继承并重写属性方法

1、Vue.extend() vue 中通过 Vue.extend() 函数来创建一个“子类”。 Vue.extend() 的参数是一个包含组件选项的对象。其中，data 选项必须是一个函数而不能是一个对象。继承而来的子组件会拥有其父组件的一切属性和方法。2、extends 类型：Object | Function 详细：允许声明扩展另一个组件 (可以是一个简单的选项对象或构造函数)，而无需使用 Vue.extend。这主要是为了便于扩展单文件组件。这和 mixins 类似。

标签：前端开发信息技术 JavaScript 软件编程语言