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

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

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

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

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

在一个页面引用这个文件

主页面接收事件

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

相关推荐
VX:Fegn0895几秒前
计算机毕业设计|基于springboot + vue智慧养老院管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
interception几秒前
js逆向之京东原型链补环境h5st
javascript·爬虫·网络爬虫
木土雨成小小测试员2 分钟前
Python测试开发之前端二
javascript·python·jquery
小二·2 分钟前
Python Web 开发进阶实战:Flask-Login 用户认证与权限管理 —— 构建多用户待办事项系统
前端·python·flask
浩瀚之水_csdn10 分钟前
python字符串解析
前端·数据库·python
全栈小510 分钟前
【前端】在JavaScript中,=、==和===是三种不同的操作符,用途和含义完全不同,一起瞧瞧
开发语言·前端·javascript
如果你好17 分钟前
Vue createRenderer 自定义渲染器从入门到实战
前端·javascript·vue.js
温宇飞28 分钟前
Web 图形合成技术:Blending 与 Porter-Duff Compositing
前端
小高00732 分钟前
读懂 Tailwind v4:为什么它是现代前端项目的必选项?
前端·javascript·vue.js
boooooooom33 分钟前
computed、watch 与 watchEffect 的使用边界与实战指南
javascript·vue.js