fix 无限滚动

This commit is contained in:
2021-07-02 12:15:48 +08:00
parent 0d9e77afc7
commit 4053d6ff0a
4 changed files with 32 additions and 11 deletions

View File

@@ -202,7 +202,7 @@ namespace Ewide.Core
.Select(u => u.Permission).ToListAsync(); .Select(u => u.Permission).ToListAsync();
#if DEBUG #if DEBUG
#else #else
await _sysCacheService.SetPermission(userId, permissions); // 缓存结果 await _sysCacheService.SetPermission(UserId, permissions); // 缓存结果
#endif #endif
} }
return permissions; return permissions;

View File

@@ -688,3 +688,10 @@
padding: 0; padding: 0;
} }
} }
.yo-popover-infinite-scroll {
.ant-popover-inner-content {
overflow-y: auto;
max-height: 300px;
}
}

View File

@@ -682,3 +682,10 @@
padding: 0; padding: 0;
} }
} }
.yo-popover-infinite-scroll {
.ant-popover-inner-content {
overflow-y: auto;
max-height: 300px;
}
}

View File

@@ -1,5 +1,5 @@
import React, { Component } from 'react' import React, { Component } from 'react'
import { Badge, Divider, List, Menu, Modal, Popover, Row, Spin } from 'antd' import { Badge, Button, Divider, List, Menu, Modal, Popover, Row, Spin } from 'antd'
import { AntIcon, Image } from 'components' import { AntIcon, Image } from 'components'
import { api } from 'common/api' import { api } from 'common/api'
import InfiniteScroll from 'react-infinite-scroller' import InfiniteScroll from 'react-infinite-scroller'
@@ -69,7 +69,7 @@ export default class notice extends Component {
loadMore={pageIndex => this.onInfiniteOnLoad(pageIndex)} loadMore={pageIndex => this.onInfiniteOnLoad(pageIndex)}
hasMore={!loading && hasMore} hasMore={!loading && hasMore}
useWindow={false} useWindow={false}
threshold={100} threshold={50}
> >
<List <List
itemLayout="vertical" itemLayout="vertical"
@@ -79,14 +79,15 @@ export default class notice extends Component {
<List.Item.Meta <List.Item.Meta
avatar={<Image id={item.avatar} type="avatar" />} avatar={<Image id={item.avatar} type="avatar" />}
title={ title={
<a <>
className="ellipsis" <a onClick={() => this.onOpenDetail(item.id)}>
onClick={() => this.onOpenDetail(item.id)}
>
{item.title} {item.title}
</a> </a>
<small className="text-normal ml-xs">
{moment(item.createdTime || item.publicTime).fromNow()}
</small>
</>
} }
description={moment(item.createdTime || item.publicTime).fromNow()}
/> />
<div className="ellipsis-3 text-gray">{item.content}</div> <div className="ellipsis-3 text-gray">{item.content}</div>
</List.Item> </List.Item>
@@ -98,6 +99,11 @@ export default class notice extends Component {
</div> </div>
)} )}
</List> </List>
{!hasMore && (
<Button type="text" block>
查看全部
</Button>
)}
</InfiniteScroll> </InfiniteScroll>
) )
} }
@@ -110,8 +116,9 @@ export default class notice extends Component {
arrowPointAtCenter={true} arrowPointAtCenter={true}
placement="bottomRight" placement="bottomRight"
content={this.renderList()} content={this.renderList()}
overlayInnerStyle={{ width: 300, maxHeight: 300, overflowY: 'auto' }} overlayInnerStyle={{ width: 300 }}
overlayStyle={{ zIndex: 999 }} overlayStyle={{ zIndex: 999 }}
overlayClassName="yo-popover-infinite-scroll"
> >
<span className="header-action"> <span className="header-action">
<Badge count={count}> <Badge count={count}>