This is the start of an App class in a react app of a todo list, the app currently getting the user data from the server in "componentDidMount" and re-getting it in "componentDidUpdate" after every post request but I can only see the changes after I make another call (then I see the first change and not the second). I need to see the changes immediately... any ideas? (Thank you so much in advance)
here's the code:
class App extends Component {
constructor(props) {
super(props);
this.state = {
expand: null,
intervalIsSet: null,
user: null,
currentList: 0
};
this.create = this.create.bind(this);
this.update = this.update.bind(this);
this.toggleCompletion = this.toggleCompletion.bind(this);
this.remove = this.remove.bind(this);
this.handleExpandClick = this.handleExpandClick.bind(this);
this.handleChangeCurrentList =
this.handleChangeCurrentList.bind(this);
this.handleAddList = this.handleAddList.bind(this);
this.handleRemoveList = this.handleRemoveList.bind(this);
this.handleListNameUpdate = this.handleListNameUpdate.bind(this);
this.copyPlannedTodo = this.copyPlannedTodo.bind(this);
this.handleChangeColor = this.handleChangeColor.bind(this);
this.handleAlertedTodo = this.handleAlertedTodo.bind(this);
this.handleChangeLang = this.handleChangeLang.bind(this);
}
componentDidMount() {
this.getUserFromDb();
}
componentDidUpdate() {
if(this.state.boolean) {
this.getUserFromDb();
this.setState({boolean: false});
}
}
getUserFromDb = () => {
//let getUrl = "daymaker/" + document.getElementById('userId').innerHTML;//after build
let getUrl = window.location.href.slice(0, 20) + "1/daymaker/5e4c290492d81d7474b1af01";//before build
axios.get(getUrl).then((res) => {
this.setState({ user: res.data.userData });
});
};
create(newTodo) {
let getURL = "daymaker/putData";
axios.post(getURL, {
userId: this.state.user._id,
todo: newTodo,
currentList: this.state.currentList
});
this.setState({boolean: true});
}