Vue 一个简单的mixin的运用,对mixin的初步了解

刚学vue的时候,从一个大神口中老是说什么混入混入,觉得很神秘,后来一了解,原来如此:

其实从字面意思来理解,就是将代码里面的内容混在一起了,上一段代码可能比较好理解一点。

先定义一个简单混入文件mixin.js

javascript 复制代码
export default {
    created(){
        console.log("子路由打开=====", this.$route.path)
        this.$emit("childOpen", this.$route.path);
    },
    data() {
        return {
            
        }
    },
    methods: {
        
    }
};

在一个页面引用这个文件

主页面接收事件

执行效果如下:​​​​​​​

相关推荐
LilySesy27 分钟前
ABAP+WHERE字段长度不一致报错解决
java·前端·javascript·bug·sap·abap·alv
Wang's Blog1 小时前
前端FAQ: Vue 3 与 Vue 2 相⽐有哪些重要的改进?
前端·javascript·vue.js
再希2 小时前
React+Tailwind CSS+Shadcn UI
前端·react.js·ui
用户47949283569152 小时前
JavaScript 的 NaN !== NaN 之谜:从 CPU 指令到 IEEE 754 标准的完整解密
前端·javascript
群联云防护小杜2 小时前
国产化环境下 Web 应用如何满足等保 2.0?从 Nginx 配置到 AI 防护实战
运维·前端·nginx
ss2732 小时前
Springboot + vue 医院管理系统
vue.js·spring boot·后端
醉方休3 小时前
Web3.js 全面解析
前端·javascript·electron
前端开发爱好者3 小时前
前端新玩具:Vike 发布!
前端·javascript
今天也是爱大大的一天吖3 小时前
vue2中的.native修饰符和$listeners组件属性
前端·javascript·vue.js
fxshy3 小时前
在 Vue 3 + Vite 项目中使用 Less 实现自适应布局:VW 和 VH 的应用
前端·javascript·less