feat(compLibrary): 完善复合组件库的搜索功能

master
钟良源 2 weeks ago
parent 9f7062250f
commit 1621cb920b

@ -16,6 +16,7 @@ interface CompGridProps {
const CompGrid: React.FC<CompGridProps> = ({ componentType }) => { const CompGrid: React.FC<CompGridProps> = ({ componentType }) => {
const [compData, setCompData] = useState([]); const [compData, setCompData] = useState([]);
const [paginationData, setPaginationData] = useState({ totalCount: 0, currPage: 1, pageSize: 11 }); const [paginationData, setPaginationData] = useState({ totalCount: 0, currPage: 1, pageSize: 11 });
const [searchKeyword, setSearchKeyword] = useState('');
useEffect(() => { useEffect(() => {
if (componentType) getComponentData(componentType); if (componentType) getComponentData(componentType);
@ -28,7 +29,8 @@ const CompGrid: React.FC<CompGridProps> = ({ componentType }) => {
}; };
const res: any = await apiList[key]({ const res: any = await apiList[key]({
currPage: paginationData.currPage, currPage: paginationData.currPage,
pageSize: paginationData.pageSize pageSize: paginationData.pageSize,
name: searchKeyword
}); });
if (res.code === 200) { if (res.code === 200) {
@ -44,7 +46,15 @@ const CompGrid: React.FC<CompGridProps> = ({ componentType }) => {
useEffect(() => { useEffect(() => {
getComponentData(componentType); getComponentData(componentType);
}, [paginationData.currPage]); }, [paginationData.currPage, searchKeyword]);
const handleSearch = (value: string) => {
setSearchKeyword(value);
setPaginationData({
...paginationData,
currPage: 1
});
};
return ( return (
<> <>
@ -53,6 +63,8 @@ const CompGrid: React.FC<CompGridProps> = ({ componentType }) => {
searchButton="搜索" searchButton="搜索"
placeholder="请输入名字" placeholder="请输入名字"
style={{ width: 350 }} style={{ width: 350 }}
onSearch={handleSearch}
allowClear
/> />
<Row style={{ marginBottom: 16 }}> <Row style={{ marginBottom: 16 }}>
{compData.map((v, i) => { {compData.map((v, i) => {

Loading…
Cancel
Save