javascript - 无法在 Javascript 中调用函数 - Chart.js

Question

我正在使用 electron 和 chart.js 开发一个应用程序。我已将位于 HTML 文件中的删除按钮连接起来。当我按下按钮时，我的 sqlite3 数据库中的信息就像魅力一样被删除。然后我按第二个按钮刷新我的图表。它再次像预期的那样工作。我想从删除函数中调用刷新函数，但我的图表保持不变。

let myLabel = [];
let myValues = [];

function delData() {
    var data_firstName = document.getElementById('firstName').value;

    const sqlite3 = require('sqlite3').verbose();
    let db = new sqlite3.Database('./data.db');
    db.run(`DELETE FROM Info WHERE firstName = '${data_firstName}';`, function(err, row) {});
    db.close();
    refreshData();
}

function refreshData() {
    myLabel = [];
    myValues = [];

    const sqlite3 = require('sqlite3').verbose();
    let db = new sqlite3.Database('./data.db');
    db.each('SELECT firstName, age FROM Info;', function(err, row) {
        myLabel.push(row.firstName);
        myValues.push(row.age);
    });
    db.close();
    popChart(myLabel, myValues);
}

function popChart (myLabel, myValues) {

    if (typeof testChart !== 'undefined') {
        testChart.destroy();
    }

    let myChart = document.getElementById('myChart').getContext('2d');

    testChart = new Chart(myChart, {
        type: 'bar',
        data: {
            labels: myLabel,
            datasets: [{
                label: 'Age',
                data: myValues,
                backgroundColor: 'rgba(84, 103, 180, 0.69)'
            }]
        },
        options: {}
    });
}

Answer 1

在调用 refreshData 函数之前，您的 delData 函数不会等待从数据库中删除项目，请使用:

function delData() {
  var data_firstName = document.getElementById('firstName').value;

  const sqlite3 = require('sqlite3').verbose();
  let db = new sqlite3.Database('./data.db');
  db.run(`DELETE FROM Info WHERE firstName = '${data_firstName}';`, function(err, row) {
    db.close();
    refreshData();
  });
}

因此刷新将在删除后运行。

您可以使用 ES6 async/await 获得相同的结果:

async function delData() {
  var data_firstName = document.getElementById('firstName').value;

  const sqlite3 = require('sqlite3').verbose();
  let db = new sqlite3.Database('./data.db');
  await db.run(`DELETE FROM Info WHERE firstName = '${data_firstName}';`);
  db.close();
  refreshData();
}

这将等到 db 命令完成，然后继续执行。