github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat:update pagination icon

pull/2003/head
cydiacen 2020-04-02 11:57:56 +08:00
parent ec50149085
commit c5e71f3c63
1 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
components/pagination/Pagination.jsx
View File

@ -5,7 +5,10 @@ import LocaleReceiver from '../locale-provider/LocaleReceiver';
import { getOptionProps, getListeners } from '../_util/props-util'; import { getOptionProps, getListeners } from '../_util/props-util';
import VcPagination from '../vc-pagination'; import VcPagination from '../vc-pagination';
import enUS from '../vc-pagination/locale/en_US'; import enUS from '../vc-pagination/locale/en_US';
import Icon from '../icon'; import LeftOutlined from '@ant-design/icons-vue/LeftOutlined';
import RightOutlined from '@ant-design/icons-vue/RightOutlined';
import DoubleLeftOutlined from '@ant-design/icons-vue/DoubleLeftOutlined';
import DoubleRightOutlined from '@ant-design/icons-vue/DoubleRightOutlined';
import { ConfigConsumerProps } from '../config-provider'; import { ConfigConsumerProps } from '../config-provider';
export const PaginationProps = () => ({ export const PaginationProps = () => ({
@ -53,19 +56,19 @@ export default {
getIconsProps(prefixCls) { getIconsProps(prefixCls) {
const prevIcon = ( const prevIcon = (
<a class={`${prefixCls}-item-link`}> <a class={`${prefixCls}-item-link`}>
<Icon type="left" /> <LeftOutlined/>
</a> </a>
); );
const nextIcon = ( const nextIcon = (
<a class={`${prefixCls}-item-link`}> <a class={`${prefixCls}-item-link`}>
<Icon type="right" /> <RightOutlined/>
</a> </a>
); );
const jumpPrevIcon = ( const jumpPrevIcon = (
<a class={`${prefixCls}-item-link`}> <a class={`${prefixCls}-item-link`}>
{/* You can use transition effects in the container :) */} {/* You can use transition effects in the container :) */}
<div class={`${prefixCls}-item-container`}> <div class={`${prefixCls}-item-container`}>
<Icon class={`${prefixCls}-item-link-icon`} type="double-left" /> <DoubleLeftOutlined class={`${prefixCls}-item-link-icon`} />
<span class={`${prefixCls}-item-ellipsis`}>•••</span> <span class={`${prefixCls}-item-ellipsis`}>•••</span>
</div> </div>
</a> </a>
@ -74,7 +77,7 @@ export default {
<a class={`${prefixCls}-item-link`}> <a class={`${prefixCls}-item-link`}>
{/* You can use transition effects in the container :) */} {/* You can use transition effects in the container :) */}
<div class={`${prefixCls}-item-container`}> <div class={`${prefixCls}-item-container`}>
<Icon class={`${prefixCls}-item-link-icon`} type="double-right" /> <DoubleRightOutlined class={`${prefixCls}-item-link-icon`} />
<span class={`${prefixCls}-item-ellipsis`}>•••</span> <span class={`${prefixCls}-item-ellipsis`}>•••</span>
</div> </div>
</a> </a>