Javascript 如何防止在html中显示重复行?
我遵循并完成了本教程。然而,当我在图中添加新投票时,重复的行显示在末尾 我不熟悉DAPP、web开发或javascript,所以我不知道我的错误在哪里 代码来自Javascript 如何防止在html中显示重复行?,javascript,html,ethereum,decentralized-applications,ganache,Javascript,Html,Ethereum,Decentralized Applications,Ganache,我遵循并完成了本教程。然而,当我在图中添加新投票时,重复的行显示在末尾 我不熟悉DAPP、web开发或javascript,所以我不知道我的错误在哪里 代码来自 我不知道添加新行是从哪里来的,我正试图阻止它。问题在于JavaScript的异步特性,应用程序在删除旧行之前没有等待区块链的响应,因此发生的是数据被插入dom两次,修复方法是以不同的方式处理承诺。将所有promise调用分组以将候选对象添加到一个数组中,然后等待所有候选对象都被解析后将其添加到dom中 App.contracts.El
我不知道添加新行是从哪里来的,我正试图阻止它。问题在于JavaScript的异步特性,应用程序在删除旧行之前没有等待区块链的响应,因此发生的是数据被插入dom两次,修复方法是以不同的方式处理承诺。将所有promise调用分组以将候选对象添加到一个数组中,然后等待所有候选对象都被解析后将其添加到dom中
App.contracts.Election.deployed()
.then(function(instance) {
electionInstance = instance;
return electionInstance.candidatesCount();
})
.then(function(candidatesCount) {
const promises = [];
// Store all prosed to get candidate info
for (var i = 1; i <= candidatesCount; i++) {
promises.push(electionInstance.candidates(i));
}
// Once all candidates are received, add to dom
Promise.all(promises).then(candidates => {
var candidatesResults = $("#candidatesResults");
candidatesResults.empty();
var candidatesSelect = $("#candidatesSelect");
candidatesSelect.empty();
candidates.forEach(candidate => {
var id = candidate[0];
var name = candidate[1];
var voteCount = candidate[2];
// Render candidate Result
var candidateTemplate =
"<tr><th>" +
id +
"</th><td>" +
name +
"</td><td>" +
voteCount +
"</td></tr>";
candidatesResults.append(candidateTemplate);
// Render candidate ballot option
var candidateOption =
"<option value='" + id + "' >" + name + "</ option>";
candidatesSelect.append(candidateOption);
});
});
return electionInstance.voters(App.account);
})
首先显示您的代码。我遵循上面的github链接。在github里