vue.js表格分页示例
发布时间：2020-12-17 03:06:23 所属栏目：百科 来源：网络整理
导读：分页一般和表格一起用，分页链接作为表格的一部分，将分页链接封装成一个独立的组件，然后作为子组件嵌入到表格组件中，这样比较合理。 效果： 代码： 1.注册一个组件 js this.all ) { right = this.all} while (left 模板： HTML： ... 当点击分页链接的时
|
分页一般和表格一起用，分页链接作为表格的一部分，将分页链接封装成一个独立的组件，然后作为子组件嵌入到表格组件中，这样比较合理。 效果：
代码： 1.注册一个组件 js this.all ) { right = this.all}
while (left <= right){
list.push(left);
left ++;
}
return list;
},showLast: function(){
return this.cur != this.all;
},showFirst: function(){
return this.cur != 1;
}
}
});
模板： HTML：
...
当点击分页链接的时候，通过watch cur，子组件分发 page-to 事件，通过 @page-to="loadList" 标签指定使用父组件 loadList 方法处理事件，父组件接收到page值然后ajax加载数据，根据服务端返回计算并更新自身的 pageAll 值，因为子组件prop通过 :all="pageAll" 动态绑定了父组件的pageAll对象，所以子组件会联动更新。 附上一个简单的表格组件例子: 精彩专题分享：
本文已被整理到了《》，欢迎大家学习阅读。 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。
（编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
