Hello, I’m currently working through the react todo list tutorial and have made it to more or less the end, having implemented conditional rendering and every major feature save editing and filtering.
In trying to implement editing I’ve run an issue, it breaks my code but mostly it makes me think I don’t understand react/nextJS imports:
Specifically how does Todo.js utilize functions written in App.js.
When Todo.js references an App.js function inside of an arrow function such as using deleteTask on line 93 of the official repo it works fine, even in my code.
onClick={() => props.deleteTask(props.id)}
However when I tried writing the handleSubmit function I receive 2 errors:
Even when I wholly replace the editTask function in App.js and the HandleSubmit function in Todo.js with the working version from the repo I get the same issue. I understand I have the same problem A.S.J. had in this stackoverflow thread but I’d like to know where I went wrong and what’s a better practice to prevent this in the future. Specifically how does the official repo use editTask outside of an arrow function and where have I erred. More generally why can I call deleteTask or editTask from Todo.js. Because they’re children of App.js? How does the flow of information work?
More info/code can be provided though it follows the tutorial code and official repo quite closely.
