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

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

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

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

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

在一个页面引用这个文件

主页面接收事件

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

相关推荐
Anastasiozzzz4 分钟前
阿亮随手记:动态条件生成Bean
java·前端·数据库
Highcharts.js21 分钟前
数据之美:用Highcharts打造专业级弧线图
javascript·数据库·highcharts·图表开发·弧线图
mclwh42 分钟前
关于React-Konva 报:Text components are not supported....错误的问题
前端·react.js
SuperEugene1 小时前
错误处理与 try/catch:真实项目里应该捕什么错?
前端·javascript·面试
Amumu121382 小时前
CSS引入方式
前端·css
我是Superman丶2 小时前
【Demo】✋ 数字手势识别 Html
前端·html
HelloReader2 小时前
Leptos + Tauri 2 前端配置Trunk + SSG + 移动端热重载一次打通(Leptos 0.6 口径)
前端
HelloReader2 小时前
Next.js + Tauri 2 用 Static Export 把 React 元框架装进桌面/移动端
前端
Wect3 小时前
从输入URL到页面显示的完整技术流程
前端·面试·浏览器
没有bug.的程序员3 小时前
自动化测试之魂:Selenium 与 TestNG 深度集成内核、Page Object 模型实战与 Web UI 交付质量指南
前端·自动化测试·selenium·ui·testng·page·object