Question 52892 in Javascript Question posted in
A very good W3school tutorial can be found here.

Calling Vue3 component methods from outside – Javascript

My Vue 3 application is as follow:

app.js

import { createApp } from "vue";
import App from "./app.vue";

let vm = createApp(App)
vm.mount("#app");

window.vm = vm

app.vue

<script>
export default {
  name: "App",
  methods: {
    async someMethod() {
      this.data.push(1);
    }
    //...

}
</script>

In Vue 2, it is possible to reach internal methods using the following code:

vm.$children[0].someMethod()

However, it does not work with Vue3.

How can I integrate my Vue component to an external API using a similar technique in Vue 3?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    This question was answered by Estus Flask in the comments section.

    app.js

    import { createApp } from "vue";
import App from "./app.vue";

let app = createApp(App)
let vm = app.mount("#app"); //This return instance is the proxy to the VueJs component

window.vm = vm;

  2. 0

    In Vue 3, to access the internal methods of a component, you should consider using defineExpose to expose the method in that component

    https://vuejs.org/api/sfc-script-setup.html#defineexpose

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search