0👍
You are using v-html in wrong way. You should add
<a class="button" @click.prevent="enableExceedable(issue.mapping)">Enable exceedable limits</a>
inside your div
<div v-if="hasIssue !== {} && issue.is_issue" v-for="(issue, key) in hasIssue" :key="key" class="issues">
<a class="button" @click.prevent="enableExceedable(issue.mapping)">Enable exceedable limits</a>
</div>
0👍
Maybe this will help:
<div
v-if="hasIssue !== {} && issue.is_issue"
v-for="(issue, key) in hasIssue"
:key="key"
class="issues"
v-html="errorText"
@click="processIssue(issue)"
>
</div>
data: {
hasIssue: [],
errorText: `
<button class="button">
Enable exceedable limits
</button>
`
},
methods: {
processIssue (issue) {
this.enableExceedable(issue.mapping)
},
enableExceedable (mapping) {
// implementation
}
}
PS: I’m using button instead of anchor. Use anchors only when they will really act as anchors, not just buttons. Better semantics. Recommended way.
- [Vuejs]-Setting "starter" values on created() with Vuex
- [Vuejs]-Pass props from child component to Vue JS page and use @blur/@focus function to call on the prop inside the parent
Source:stackexchange.com