How to render html in script tag vue js

Question

I'm trying to render dynamic html in script tag

I'm create a custom data-table component for my project and now i trying to use a column for operations

but I can't assign function to button or more !

{
     field: 'operation',
     title: 'Operations',
     template: (e) => {
         return '<button v-on:click="methodFunction">Click</button>';
     }
}

please help me.

tony19 · Accepted Answer · 2022-07-15 02:24:17Z

2

Which library are you using for creating the Data Table component?

You might try something like:

{
     field: 'operation',
     title: 'Operations',
     template: Vue.compile('<button v-on:click="methodFunction">Click</button>')
}

This will let Vue actually compile the template, during which it goes through the attributes passed.

Note: Vue.compile() returns a render function. https://v2.vuejs.org/v2/api/#Vue-compile

edited Jul 15, 2022 at 2:24

tony19

140k23 gold badges281 silver badges354 bronze badges

answered Jun 4, 2020 at 13:24

Sachin Rajput

666 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Daniyal.K Over a year ago

thanks , but its not working too . when i use this , give Vue is not defined error

Sachin Rajput Over a year ago

Hey I thought it was implicit. Add to the top of the file: import Vue from 'vue';

Collectives™ on Stack Overflow

How to render html in script tag vue js

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related