1: Problem Analysis
The data can come out, and the page is displayed normally, but there is an error.
[Vue warn]: Unhandled error during execution of native event handler; means that an unhandled error occurred during execution of the native event handler
TypeError: Cannot read property 'children' of undefined means that the property children is undefined
The code at the error reporting point: and click the error to directly locate this.categoryList[index], which is behind the index, so we can see that there is a problem here
clickFirstCategory(index) {
this.isActive = index;
// 点击过快时，商品展示报错（找不到children）
this.secondCateList = this.categoryList.length > 0 && this.categoryList[index].children;
this.thirdCateList = this.secondCateList.length > 0 && this.secondCateList[index].children;
}2. Solve
Since an unhandled error occurs during the execution of a native event handler, it is sufficient to handle the error.
The first thing that comes to mind is try catch, but although the error is caught, if the error log in the catch is printed, it still exists, so in fact, it only catches the error and does not solve it
Solution: rewrite the judgment condition here, and the problem is solved
if (this.categoryList.length > 0 && this.categoryList[index])
this.secondCateList = this.categoryList[index].children;
if (this.secondCateList.length > 0 && this.secondCateList[index])
this.thirdCateList = this.secondCateList[index].children;