Homework week 4 #38
Homework week 4 #38
Conversation
|
Hey @JiDarwish. Just had a chance to check out this PR. Everything seems to be working exactly as intended, can you remind me what your specific question was? |
| handleToggleEdit={this.handleToggleEdit} | ||
| handleChangeItem={this.handleChangeItem} | ||
| data={this.props.data} | ||
| done={done} |
There was a problem hiding this comment.
This is were I didn't quiet get it, because the data is the entire todo object so it also contains done: boolean and should cause a rerender when its value change. This is only happening if the value of the text and deadline properties change. That's why I had to pull out the done property out of data and pass it separately. But I still don't get why.
There was a problem hiding this comment.
Thanks for checking it out @isaachinman
There was a problem hiding this comment.
Okay, I understand your question now. As I was saying via PM in Slack, this is by design within mobx-react.
With experience you will get very good at writing Google searches that return GitHub issues... I Googled:
mobx-react child not rerendering
And found this issue within the mobx-react repo.
I am also new to MobX, so this is new territory for me as well. Feel free to read the entire thread, but this comment and the maintainer's response immediately after are the most important.
I refactored your app so that TodoItem.js only passes this.props.data to NewTodoFormToggle.js, and then simply added a @observer decorator to NewTodoFormToggle, and it works fine.
Sorry for the confusion, this functionality is not at all intuitive for me either, but is apparently what you sign up for with MobX.
I really found refactoring code hard and had a lot of trouble with it so this is maybe not my best work.