首页 > 其他分享 >vue跨页面调用函数

vue跨页面调用函数

时间:2024-11-11 15:44:02浏览次数:1  
标签:vue middle utils 调用函数 Middle export methodA 页面

1、在utils文件夹下创建中间件middle.js

// 中间件 实现跨页面调用方法
import Vue from 'vue'
export default new Vue

2、被调用页面代码

<template></template>
<script>
import Middle from '@/utils/middle.js';
export default {
    mounted() {
        let _this = this
        Middle.$on('methodA', (data) => {
            _this.methodA();
        })
    },
    methods: {
        methodA() {
            console.log("哈哈哈")
        }
    }
}
</script>

3、调用页面代码

<template></template>
<script>
import Middle from '@/utils/middle.js';
export default {
    methods: {
        methodB() {
            //跨页面调取函数
            Middle.$emit('methodA');
        }
    }
}
</script>

 

标签:vue,middle,utils,调用函数,Middle,export,methodA,页面
From: https://www.cnblogs.com/tingorb/p/18539847

相关文章