Recently, I encountered a very common mistake in development. The reason is that I did not check the code carefully when I was developing it. When deleting the data, I deleted the return in the data together, resulting in no response to the routing jump click. The data function is a special method in Vue that is used to define the local state of the component. After reading the relevant documentation, I learned that it must return an object that contains various data attributes used in the component.
Wrong writing:
export default {
data() {
}
}
If your data function returns nothing (or returns null or a non-object value), then you may see similar error messages indicating that data is not defined or is of an unexpected type. as follows:
vue.min.js:6 TypeError: Cannot read property '__ob__' of undefined
at a.e.$destroy (vue.min.js:6)
at destroy (vue.min.js:6)
at b (vue.min.js:6)
at b (vue.min.js:6)
at b (vue.min.js:6)
at a.__patch__ (vue.min.js:6)
at a.e.$destroy (vue.min.js:6)
at destroy (vue.min.js:6)
at b (vue.min.js:6)
at $ (vue.min.js:6)
For the above problem, the solution is to either not write data(){}, or you must write return to return an object; ensure that your data function always returns an object to contain the data attributes you need to use in the component.
A basic data function example, which returns an object containing a property called message:
export default {
data() {
return {
message: 'Hello Vue!'
}
}
}
Someone encountered this kind of mistake in previous project development, and everyone analyzed it together. Unexpectedly, half a year later, due to my own carelessness, I also made such a low-level mistake.