It's important that we won't modify props inside our child components. Props should be considered the source of truth when passed down to a component and thus, change the value from within a child component is typically bad practice. There are some unique case scenarios however where it may be appropriate to do so, like when using the .sync modifier to achieve two-way data binding.
If we use our previous example and change the todos prop from within the child, we'll get a warning inside the console:
methods: { completeTodo(todo) { this.todo = [{id: 1, name: 'Do the dishes.'}]; this.$emit('completeTodo', todo) }}
