Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

176
Views
Vue 3 How to get rendered html element from a component?

This is my component name LayerComponent (dummy).

<script>
export default {
  data() {
    return {
      count: 0
    }
  }
}
</script>

<template>
  <button @click="count++">You clicked me {{ count }} times.</button>
</template>

I need the render DOM element in another component's mounted hook for a third-party library. and also need access the store.

In Vue 2 I got rendered dom by this way.

    import Vue from "vue";
    import LayerComponentfrom "./LayerComponent";


  ...other code
  ........
  mounted() {

    const lsComponent = Vue.extend(LayerComponent)
    const domElement= new lsComponent({
      store: this.$store,
    }).$mount();

   let htmlElement = domElement.$el;
//Now I can use this element in vanilla JavaScript.
   }

In Vue 2 this works very fine.

But how do I do the same thing in Vue 3?

I have tried this way:

    const lsApp = createApp(LayerComponent);
    lsApp.use(this.$store);

but the store is not working.

Note: I am using VueX 4.

Thanks in advance.

about 4 years ago · Santiago Gelvez
1 answers
Answer question

0

The parameter pass to app.use() must a Vue plugin so I think you should export store instance export const store = createStore(options); to pass as parameter in expression lsApp.use(store);

about 4 years ago · Santiago Gelvez Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!