首页 > 解决方案 > 无法识别由数组动态生成的 div 内调用的事件或方法

问题描述

它根据数组生成“n”个 div。您在按钮内添加的任何事件或功能都不起作用。

错误调度事件

调用函数出错

在全局变量中保存 id 时出错

将其从渲染中处理出来,但也不要接受该事件。:

this.fundsData.map(function (g, index, array) {
  document.getElementById(g.idFund).addEventListener("click", this._getFundSelected(g.idFund));
  console.log("AddEvent " + g.idFund);
})

代码:

${this.fundsData.map(function (g, index, array) {
  if (g.nameRisk == "Conservador") {
    return html`
            <div class="panel-risk">
              <div class="risk-header">
                <div>
                  <list-header heading="${g.nameFund}" ></list-header>
                  <div class="risk-type">${g.nameRisk}</div>
                </div>
                <button-icon id="${g.idFund}" type="submit"
                @click="${(e) => {
                  e.preventDefault();
                  console.log("event");
                  this.dispatchEvent(new CustomEvent('cfon-riskprofile-selected', { bubbles: true, composed: true, detail: { fundId: g.idFund } }));
                  //this.idFundSelected = g.idFund;
                }}"
                icon="${Continueright()}" variant="no-background">
                </button-icon>
              </div>
              <div class="risk-body">
                <panel-risk risk="${g.lvlRisk}" max-risk="8" max-in-view="8" label-index="1"
                  label="Riesgo: ${g.nameLvlRisk}" risk-text="">
                </panel-risk>
              </div>
              <div class="risk-body-description">
                Invierte desde <strong>$${g.minMoney}</strong> </br>
                Rentabilidad ${g.nameRent} de <strong>${g.rentability} E.A</strong>
              </div>
            </div>`;
  }
})}

标签: javascriptclickdom-events

解决方案


推荐阅读