Vue2--Element UI分页高亮异常问题解决

一.问题描述：

这里有一个表单组件和一个分页组件

 我们要实现一个效果，就是添加数据之后，跳转到我们添加的数据所在的那个分页。我这边是跳转到最后一页。这时就会有以下问题：

 在这里，我们的第七页数据是已经满了，于是需要加到第八页去，我便修改了当前页(currentpage)的值，并发送请求。然而我们获取并渲染到了第八页的数据，但高亮显示的却是 7 。

二.问题原因及解决方法：

问题原因1.

我们在从后端获取数据之后，组件那边由于对currentpage的保护机制，在同步更新前发现我们的currentpage大于internalPageCount(组件中页码的最大数)，于是让currentpage的值等于internalPageCount(组件中页码的最大数)。

 于是就是接下来这个情况

解决方法：

给添加事件添加一个开关，这里我添加的是: 'isAdd'

 然后在数据更新之后，判断是不是添加事件触发的数据更新，如果是就让currentpage加1，然后让isAdd为false。完成

 

问题原因2：

这个问题是我无意间发现的，currentpage正常，但是他的internalCurrentPage却比currentpage少1，后来优化代码之后问题就解决了，所以具体产生原因就不得而知了。

解决方法：

直接找到组件，修改他的值即可

 

 

三.总结

显示异常一般都是因为数据对不上，这种情况多看看vue的调试工具，一个一个测试就好了