I am not user what is causing the issue. When I input a ticker in the serach bar for example FB the data only renders half of the information but not the calculationModel and addingYear function in the componentDidUpdate, unless I reenter the input variable again in the search bar to get all the information be displayed how it suppose to be I have to renter the same or any other ticker each time to get the information to be properly displayed and I have to take the same steps when I refresh the page.
This is what my component looks like:
constructor(props) {
super(props);
this.state = {
ticker: "",
reportDate: "",
subkey: "",
FCF: "",
year: "",
futureCashFlows: "",
npv: "",
terminalValue: "",
totalPresentValue: "",
addYear1: "",
addYear2: "",
addYear3: "",
addYear4: "",
addYear5: ""
};
}
applyData(data) {
this.setState({
reportDate: data.reportDate,
subkey: data.subkey,
commonShares: data.commonShares,
year: data.reportDate.slice(0, 4)
});
}
CalulationModel() {
const DCF_Calulation = calculate(
this.state.FCF,
[this.props.growthRate],
this.props.peRate,
this.props.discouted,
2
);
this.setState({
futureCashFlows: DCF_Calulation.futureCashFlows.slice(1, 6),
totalPresentValue: DCF_Calulation.totalPresentValue,
npv: Math.pow(1 + this.props.discoutedRate, 5)
});
}
printState() {
console.log("New state AFTER update");
console.log(this.state);
}
addingYear() {
// const myDate = moment(this.state.reportDate, "YYYY-MM-DD");
const myDate = moment(this.state.year, "YYYY");
this.setState(
{
addYear1: myDate.add(1, "y").format("YYYY"), // 2022
addYear2: myDate.add(1, "y").format("YYYY"), // 2023
addYear3: myDate.add(1, "y").format("YYYY"), // 2024
addYear4: myDate.add(1, "y").format("YYYY"), // 2025
addYear5: myDate.add(1, "y").format("YYYY") // 2026
},
this.printState
);
}
componentDidUpdate(prevState) {
if (this.props.ticker !== prevState.ticker) {
stockFinancial.stockPulledData(
this.props.ticker,
this.applyData.bind(this)
);
this.CalulationModel();
this.addingYear();
}
}