-
Notifications
You must be signed in to change notification settings - Fork 2.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: 分页组件移动端适配 #11524
base: master
Are you sure you want to change the base?
feat: 分页组件移动端适配 #11524
Conversation
👍 Thanks for this! Please review the labels and make any necessary changes. |
@@ -630,7 +630,9 @@ $Table-strip-bg: transparent; | |||
--Pagination-padding: 0 #{px2rem(8px)}; | |||
--Pagination-padding-sm: 0 #{px2rem(4px)}; | |||
--Pagination-light-color: var(--colors-neutral-text-4); | |||
--Pagination-border: 1px solid #ccc; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
样式不要写死,用全局样式
&-simple { | ||
color: #666666; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
同
@@ -1,5 +1,5 @@ | |||
/* | |||
* @Description: Pagination分页组件 | |||
* @Descr''i''ption: Pagination分页组件 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
笔误?
}; | ||
|
||
state = { | ||
pageNum: '', | ||
internalPageNum: '1', | ||
internalPageNum: '2', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这里为什么要改?
@@ -181,11 +189,12 @@ export class Pagination extends React.Component< | |||
async handlePageNumChange(page: number, perPage?: number, dir?: string) { | |||
const {disabled, onPageChange} = this.props; | |||
const _page = isNaN(Number(page)) || Number(page) < 1 ? 1 : page; | |||
console.log(disabled, page, perPage, dir); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
删掉
@@ -10,7 +10,7 @@ import { | |||
} from 'amis-core'; | |||
import {BaseSchema} from '../Schema'; | |||
import {Pagination as BasicPagination} from 'amis-ui'; | |||
import type {MODE_TYPE} from 'amis-ui/lib/components/Pagination'; | |||
import type {MODE_TYPE} from 'amis-ui/src/components/Pagination'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
?
simplePager = ( | ||
let basePager: React.ReactNode = null; | ||
// 非简洁模式 | ||
if (mode !== 'simple' && mobileUI) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
justify-content: space-between; | ||
> li { | ||
> a, | ||
> span { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
.#{$ns}Pagination-wrap-size--sm { | ||
.#{$ns}Pagination-item { | ||
display: flex; | ||
justify-content: space-evenly; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
pageButtons[pageButtons.length - 1] | ||
]; | ||
} | ||
|
||
const go = ( | ||
const go = mobileUI ? null : ( | ||
<div className={cx('Pagination-inputGroup Pagination-item')} key="go"> | ||
{!mobileUI ? ( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这是不是不需要判断了?
.filter(v => !!v) | ||
.map(v => ({label: __('Pagination.select', {count: v}), value: v})); | ||
const perPageEle = ( | ||
const selection = mobileUI |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这里判断的意思是?下面mobile都不会用到
@@ -171,7 +179,7 @@ export class Pagination extends React.Component< | |||
|
|||
componentWillReceiveProps(nextProps: PaginationProps) { | |||
if ( | |||
this.props.mode === 'simple' && | |||
this.props.mode !== 'simple' && |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这里是为啥?
对分页器组件的移动端进行页面适配
Why
How