如何在vue js中从一个vue文件调用函数到另一个vue文件

<template>
  <ChildComponent :someData="data" @childEvent="handleChildEvent" />
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      data: 'some data'
    };
  },
  methods: {
    handleChildEvent(payload) {
      console.log('Event received with payload:', payload);
    }
  }
};
</script>

<template>
  <button @click="sendToParent">Send to Parent</button>
</template>

<script>
export default {
  props: ['someData'],
  methods: {
    sendToParent() {
      this.$emit('childEvent', 'payload from child');
    }
  }
};
</script>

npm install vuex@next --save # Vue 3

// store.js
import { createStore } from 'vuex';

export default createStore({
  state() {
    return {
      sharedData: ''
    };
  },
  mutations: {
    updateSharedData(state, payload) {
      state.sharedData = payload;
    }
  },
  actions: {
    updateSharedData({ commit }, payload) {
      commit('updateSharedData', payload);
    }
  }
});

<template>
  <div>{{ sharedData }}</div>
</template>

<script>
import { mapState, mapActions } from 'vuex';

export default {
  computed: {
    ...mapState(['sharedData'])
  },
  methods: {
    ...mapActions(['updateSharedData']),
    someMethod() {
      this.updateSharedData('new data');
    }
  }
};
</script>

<script>
import { provide } from 'vue';

export default {
  setup() {
    const sharedFunction = () => {
      console.log('Shared function called');
    };

    provide('sharedFunction', sharedFunction);
  }
};
</script>

<script>
import { inject } from 'vue';

export default {
  setup() {
    const sharedFunction = inject('sharedFunction');

    // 使用共享函数
    sharedFunction();
  }
};
</script>

// eventBus.js
import { createApp } from 'vue';
const app = createApp({});
const eventBus = app.config.globalProperties.$bus = new Vue();
export default eventBus;

import eventBus from './eventBus';
eventBus.$emit('eventName', data);

import eventBus from './eventBus';
eventBus.$on('eventName', data => {
  console.log(data);
});