ant-design-vue里的table自带分页的修改

最新推荐文章于 2024-01-05 12:03:13 发布

qq_45505241

最新推荐文章于 2024-01-05 12:03:13 发布

阅读量3.2k

点赞数

本文链接：https://blog.csdn.net/qq_45505241/article/details/105383547

版权

https://segmentfault.com/a/1190000019129757

:pagination="pagination"
//在data里写
pagination: {
        itemRender(current, type, originalElement) {
          if (type === 'prev') {
            return <a>Previous</a>
          } else if (type === 'next') {
            return <a>Next</a>
          }
          return originalElement
        }
      }
//以下是样式
/deep/.ant-table-pagination{
  margin-right: 30px;
}
.resource-content{
  // background: #fff;
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}
/deep/.ant-pagination-next,
/deep/.ant-pagination-prev {
  display: inline-block;
  min-width: 32px;
  height: 32px;
  margin-right: 8px;
  font-family: Arial;
  line-height: 30px;
  text-align: center;
  vertical-align: middle;
  list-style: none;
  background-color: #fff;
  border: 1px solid #d9d9d9;
  border-radius: 2px;
  outline: 0;
  padding: 0 10px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/deep/.ant-pagination-next:hover,
/deep/.ant-pagination-prev:hover {
  border-color: #1c9399;
}
/deep/.ant-pagination-next:hover a,
/deep/.ant-pagination-prev:hover a {
  color: #1c9399;
}
/deep/.ant-pagination-disabled.ant-pagination-prev:hover,
/deep/.ant-pagination-disabled.ant-pagination-next:hover {
  border: 1px solid #d9d9d9;
  a{
    color: #d9d9d9 !important;
  }
}