vue3中在使用setup的情况下适合不适合使用mixin

最新推荐文章于 2025-04-28 21:01:23 发布
最新推荐文章于 2025-04-28 21:01:23 发布
阅读量4.2k 收藏
点赞数 1
分类专栏： vue 文章标签： 前端 vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_47300795/article/details/123621152
版权

答案：不推荐使用
原因：mixin这个函数是非常霸道的，局部使用还好，如果是全局使用，在项目比较大的时候，个人觉得不是很好，
在vue2的时候，因为没有组合式API这一说法，所以mixin对开发人员来说能解决好多事情，但是到了vue3，这种方式已经不推荐使用了，因为我们在vue3中，JS都是在setup里面执行的，这个时候如果我们在外面写一些公共的JS文件，然后暴露出来，在需要使用到的组件里面按需引入，这种比mixin觉得更好

仅记录平常学习

【Vue】Setup 函数的使用
看花容易绣花难
10-29 2359
Setup 函数的使用
vue-setup-mixins：vue-setup-mixins
02-15
Practice_s19-s20 项目设置 npm install 编译和热重装以进行开发 npm run serve 编译并最小化生产 npm run build 整理和修复文件 npm run lint 自定义配置 请参阅。
vue3 setup学习之[mixin]
fangshuiguang的博客
03-13 1826
由于vue3 setup中没有像vue2中的mixins: []混入，因此需要手动实现它 见代码清单form-table.d.ts文件。针对一般的后台管理系统，会在大量的页面中出现搜索查询功能，此时如果需要封装这些表单和查询条件，则需要采用mixin原理来实现了。在页面中改如何使用它呢，在页面中先引入解构后，在组件中即可使用混入的封装的方法和对象。
vue mixin混入与hook
最新发布
qq_39691676的博客
04-28 343
vue混入与自定义hook
vue3 setup语法糖导入mixin
向梦想前进
08-19 1720
像这样直接导入，然后通过defineOptions声明mixin。然后就可以在这个组件使用mixin里的数据和方法了。
vue3的setup引入mixin.ts解决方案
xuelang532777032的博客
02-15 2732
序： 习惯了混入，反正不管按钮（权限展示）还是分页（权限展示），方法都要用ajax和配置（api、imgPath），我干脆都放在mixin,而setup偏偏生命周期没this，但是我又硬要用。（别告诉我性能怎么影响，国内不是遍地都是大厂，开发速度就决定了中小企业生存空间。） 解决方案： 其实很简单 //引入 import mixin from '../plugins/mixin.ts'; //调用 mixin.methods.ajax({ url:"/imgUpOn...
vue3中不能用mixin? 那就来看看Composition API叭!
weixin_44265146的博客
07-13 1547
在 Vue 3 中，官方不再推荐使用mixin。虽然 Vue 3 仍然支持mixin，但它被视为一种不推荐的模式，并且在一些情况下可能导致代码维护和理解上的困难。如果你在 Vue 3 中希望实现代码的复用和共享逻辑，推荐使用来替代mixin。我们利用组合式api的特点，他们抽象出来，可以单独建个文件夹和文件, 然后进行封装(自定义的 hook函数一般取名是以use开头)，把得到函数写在一个单独的模块中，导出，以供复用.
vue3 setup 中使用 mixin 数据
05-18
因此，如果想要在组件中使用 mixin，可以采用以下两种方式： 1. 将 mixin 对象中的属性和方法直接复制到 setup 函数中： ```javascript import { defineComponent } from 'vue' const myMixin = { data() { ...
Vue 中mixin 的用法详解
08-27
在 Vue 组件中，我们可以通过 `import` 导入 `mixin.js` 文件，并将其添加到组件的 `mixins` 选项中： ```javascript import mixin from '@/mixin'; export default { mixins: [mixin], // 其他组件选项 }; ``` ...
浅谈Vue3 Composition API如何替换Vue Mixins
10-15
2. **自定义指令和组合式函数**：Vue3 允许我们创建自定义指令（如 `v-my-directive`），并且通过组合式函数（也称为组合函数或组合API）将复杂的逻辑封装起来，这些函数可以返回需要在 `setup()` 中使用的对象，...
vue3组合式api下使用mixin
03-11
好的，我需要帮助用户了解如何在Vue 3的组合式API中使用mixin。首先，我应该回顾一下Vue 2中的mixin用法，然后对比Vue 3中的变化。根据引用[2]，Vue 2中通过mixins数组来合并组件和mixin的选项，比如数据、方法等。...
vue3时代别再写mixin，快来试试hooks
xiaofiy的博客
05-31 3140
mixin是一种思想，一种混入的思想。混入的内容就是可以在被混入的地方使用，他会自动的将混入的东西准确的分配到指定的组件中。在vue中，mixin相当于指定混入的变量&函数放入他不混入时候该放的地方。可以认为，vue中的mixin就是相当于组件中的组件。举例：表单弹框业务，属于很常见的业务场景，新增打开弹框，表单校验，编辑打开弹框进行数据回显等import {// 补充setFormValues 代码如下 /** 表单对象的赋值操作})export{});
vue3在setup当中使用混入mixins
weixin_51569223的博客
11-15 4111
vue3在setup当中使用混入mixins。
Vue3 组合式函数,实现minxins
汉堡请不要欺负面条
02-28 5415
截至目前，组合式函数应该是在VUE 3应用程序中组织业务逻辑最佳的方法。它让我们可以把一些小块的通用逻辑进行抽离、复用，使我们的代码更易于编写、阅读和维护。
Vue3中的混入（mixins）与（hooks）
热门推荐
一起学习
12-23 2万+
本文主要介绍Vue3中的混入（mixins）。
uniapp-vue3语法实现小程序全局分享（setup，mixin）
weixin_70324447的博客
12-11 4675
相信大家在开发过程中肯定碰到过小程序所有页面都要开启分享功能的需求；指定的页面(如：文章详情页)有单独的配置，而非单独配置的页面(如：付费的订单详情页)都是统一跳转到首页。
vue3中mixin的使用方法
bingjilingvsh2o的专栏
01-30 3821
在 Vue 2 中，mixins 是创建可重用组件逻辑的主要方式。尽管在 Vue 3 中保留了 mixins 支持，但对于组件间的逻辑复用，使用组合式 API 的组合式函数是现在更推荐的方式。最近在vue2迁移到vue3的项目中，对mixin的使用进行了改造，介绍一下使用方法。
vue3中使用混入mixins在setup当中
动感超人的博客
08-30 6685
我们知道,在vue2的时候,想使用混入,直接就使用,但是在vue3里,就不一样了,多了`setup`那么我们怎么使用混入在vue3当中的`setup`呢?关键就是`getCurrentInstance`
vue3.x连官网都不亲的选项——Mixin
qq_25674791的博客
10-28 860
不足 官网原文如下： 来自官网截图 简单来说不足有二： 1、所有属性都会合并到组件里面，所以相同命名会冲突。 2、写完就定下来了，不够灵活 vue3 提供了 setup，来解决这些问题。 个人见解，其实在vue2的时候就很少使用mixin来抽象逻辑，一般抽象逻辑都会使用一个封装的js对象。而mixin更多的是像封装一个“基类”那样，提供给组件继承，暂时而言个人还是觉得类似于“基类”这样的用法，使用mixin挺好。 基础 mixin 对象可以包含任意组件选项。当组件使用 mixin 对象时，所
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值