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

401
Views
Call v-on:click after append html in vuejs

Can I have call onclick when after append html in vuejs, I using vue-append

this.html = '<div id="'+folderData[key].id+'" class="col-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">' +
                    '<a href="#" class="nav-link" style="color:black" data-toggle="tooltip" title="'+textTooltip+'"> '+ 
                        '<div class="info-box '+back+'">'+
                            '<span v-on:click="gofolder('+folderData[key].id+')" class="info-box-icon bg-success '+icon+'"></span>' +
                            '<div v-on:click="gofolder('+folderData[key].id+')" class="info-box-content">' + textName + '</div>' +
                            checkbox +
                        '</div>'+
                    '</a>' + 
                '</div>'

<template>
<div v-append.sync="html" class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 pb-filemng-template-body row">
                </div>
</template>
about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

Can you just listen to @appended event?

<div v-append.sync="html" @appended="onClickHandler" class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 pb-filemng-template-body row"></div>
about 4 years ago · Juan Pablo Isaza Report

0

I using v-for and an array to load, problem solved! Firstly, I will not using vue-append and create a frames html and using v-for to create a list follow array data, because my list data will changes if I click in button Ex:

<div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 pb-filemng-template-body row">
 <div :id="item.id" class="col-12 col-sm-6 col-md-4 col-lg-3 col-xl-2" v-for="item in items" :key="item.id">
    <a href="#" class="nav-link" style="color:black" data-toggle="tooltip" :title="item.tooltip"> 
        <div class="info-box">
            <span @click="gofolder(item.id)" :class="item.icon"></span>
                <div @click="gofolder(item.id)" class="info-box-content">{{item.textName}}</div>
                <input v-if="item.checkbox === true" type="checkbox" class="" value="">
                 </div>
             </a>
            </div>
        </div>

specifically here: v-for="item in items" :key="item.id"

after, I can call event onclick on buttons then not be afraid it will take the wrong value

about 4 years ago · Juan Pablo Isaza 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!