Ожидание загрузки нескольких файлов CSV с Papaparse - PullRequest
0 голосов
/ 13 июня 2019

Я пытался загрузить несколько файлов CSV перед запуском кода на моей странице, поскольку он использует данные из файлов CSV. Я использовал PAPAPARSE.js в качестве библиотеки, чтобы помочь мне с этим, и я нашел следующее решение.

function loadData(){
    console.log("Loading Data!")
    loadNodeData();
    loadEdgeData();
    loadHeadendData();
    setup();
}

function loadNodeData(){    
    Papa.parse("Data/CSV1.csv", {
        download: true,
        step: function(row) {
            NodeData.push(row.data)
        },
        complete: function() {
            console.log("Loaded Node Data!");
            load1 = true;
        }
    });
}
function loadEdgeData(){    
    Papa.parse("Data/CSV2.csv", {
        download: true,
        step: function(row) {
            EdgeData.push(row.data)
        },
        complete: function() {
            console.log("Loaded Edge Data!");
            load2 = true;
        }
    });
}
function loadHeadendData(){ 
    Papa.parse("Data/CSV3.csv", {
        download: true,
        step: function(row) {
            HeadendArr.push(row.data)
        },
        complete: function() {
            console.log("Loaded Headend Data!");
            load3=true;
        }
    });
}

function setup() {
    intervalID = setInterval(isDataLoaded,100)
}

function isDataLoaded(){
    //Attempt to setup the page, this will only work if the data iss loaded.
    if(load1 && load2 && load3){
        console.log("LOADED");      
        _setupSearchOptions();
    }
}

У меня есть следующие настройки, но я не знаю, является ли это лучшим способом сделать что-то подобное. loadData срабатывает при загрузке страницы

<head onload="loadData()">

Это правильный способ заставить программу работать?

1 Ответ

0 голосов
/ 13 июня 2019

Более современный подход - использовать обещания.

Вы можете сократить повторение кода, создав одну функцию, которая передается в массиве url и step, чтобы передать и обернуть вызов Papa.parse() в обещании, которое разрешается в обратном вызове complete.

Затем используйте Promise.all() для вызова _setupSearchOptions() после разрешения всех трех обещаний

Что-то вроде:

function parseCsv(url, stepArr){
   return new Promise(function(resolve, reject){
       Papa.parse(url, {
           download:true,
           step: function(row){
              stepArr.push(row.data)
           },
           complete: resolve       
       });        
   });
}

function loadData(){        
    const nodeReq = parseCsv("Data/CSV1.csv", NodeData);
    const edgeReq = parseCsv("Data/CSV2.csv", EdgeData);
    const headReq = parseCsv("Data/CSV3.csv", HeadendArr);
    Promise.all([ nodeReq, edgeReq, headReq]).then(_setupSearchOptions);       
}

Обратите внимание, что обработки ошибок не былорассматривается здесь.Предположительно, apa Papa.parse также имеет некоторый коллбэк с ошибкой или ошибкой, который вы бы использовали для вызова reject() и использования catch() с Promise.all() для обработки этого сбоя

...