屏幕不是每次都呈现-反应本机

Question

您好，因此Im对本机响应还很陌生，而Im遇到的问题是并非所有组件都呈现到屏幕上。我的项目是贷款计算器；因此，我允许用户上传文件，并解析文件并获取所有重要信息，以便为他们创建新的贷款，然后显示出来。当我这样做时，唯一显示的是最后一个。谁能帮助我了解为什么会这样。

这是我的相关代码：

//this is where I allow the user to upload the file 
const pickDocument = async () => {
        try {
            let input = await DocumentPicker.getDocumentAsync({
                type: "text/plain",
            });
            setUserOut(await FileSystem.readAsStringAsync(input.uri));
        } catch (error) {
            console.log(error);
        }

        createLoans();
};

//where i remove all useless info and create loans array 
const fileParser = () => {
    const parsedLoans = [];
    var newUserOut = userOut;

    if (newUserOut.length == 0) {
        return;
    }
    //remove the grants
    var grantPos = newUserOut.search("Grant Type:");
    var pos = newUserOut.search("Loan Type:");
    //hopefully just the loans now
    newUserOut = newUserOut.slice(pos, grantPos);

    while (newUserOut.length > 0) {
        var lastPos = newUserOut.lastIndexOf("Loan Type:");
        parsedLoans.push(newUserOut.slice(lastPos, newUserOut.length));
        newUserOut = newUserOut.slice(0, lastPos);
    }
    //console.log('parsed loans: ' + parsedLoans)
    return parsedLoans;
};
//extract important info for each loan and call the method that creates the loans
const createLoans = () => {
    const newLoans = fileParser();
    const title= 'Loan Amount:$'
    const interest = 'Loan Interest Rate:'

    for(let i =0; i < newLoans.length; i++){
        var loan = newLoans[i]
        var goalTitle=loan.substring(loan.indexOf(title)+title.length,loan.indexOf('Loan Disbursed Amount:'))
        //console.log("goalTitle: " + goalTitle)
        var interestRate = loan.substring(loan.indexOf(interest)+interest.length,loan.indexOf('Loan Repayment Plan Type'))
        //console.log("Interest rate: "+ interestRate)
        var years = 0
        var paidOff = 0

        addGoalHandler(goalTitle,interestRate,years,paidOff)
    }

};
//this is where I actually create the loan objects with the right info and try to display it to the screen
const addGoalHandler = (goalTitle, interestRate, years, paidOff) => {
        //setCourseGoals([...courseGoals, enteredGoal])
        setCourseGoals((prevGoals) => [
            ...courseGoals,
            {
                id:userId.toString() + goalCounter.toString(),
                value: goalTitle,
                interest: interestRate,
                years: years,
                paidOff: paidOff
            }
        ]);
        var oldIDS = docIDS 
        oldIDS.push(userId.toString() + goalCounter.toString())
        setDocIDS(oldIDS)
        setGoalCounter(goalCounter+1)
        setIsAddMode(false);
    };