[英]typescirpt how can i define …props interface?
我在用
react-pagination
(节点程序包)
所以我安装了@types/react-pagination
我为ReactPaginate
创建了自定义组件
ReactPaginate
有很多道具。
所以我创建了...props
,该对象包含ReactPaginate's
props。
@types/react-pagination
具有接口ReactPaginateProps
所以我尝试了
interface IProps {
onPageChange?():any;
props: ReactPaginateProps; // ❓❓❓
}
const MYPagination: React.SFC<IProps> = ({
onPageChange, ...props
}) => {
<ReactPaginate {...props}/>
}
我希望如果...prop
包含( ReactPaginateProps
)之一,然后键入ok!
请教我如何创建...pros's
界面?
和反应分页道具界面是
export interface ReactPaginateProps {
/**
* The total number of pages.
*/
pageCount: number;
/**
* The range of pages displayed.
*/
pageRangeDisplayed: number;
/**
* The number of pages to display for margins.
*/
marginPagesDisplayed: number;
/**
* Label for the `previous` button.
*/
previousLabel?: React.ReactNode;
/**
* Label for the `next` button.
*/
nextLabel?: React.ReactNode;
/**
* Label for ellipsis.
*/
breakLabel?: string | React.ReactNode;
/**
* The classname on tag `li` of the ellipsis element.
*/
breakClassName?: string;
/**
* The classname on tag `a` of the ellipsis element.
*/
breakLinkClassName?: string;
/**
* The method to call when a page is clicked. Exposes the current page object as an argument.
*/
onPageChange?(selectedItem: { selected: number }): void;
/**
* The initial page selected.
*/
initialPage?: number;
/**
* To override selected page with parent prop.
*/
forcePage?: number;
/**
* Disable onPageChange callback with initial page. Default: false
*/
disableInitialCallback?: boolean;
/**
* The classname of the pagination container.
*/
containerClassName?: string;
/**
* The classname on tag `li` of each page element.
*/
pageClassName?: string;
/**
* The classname on tag `a` of each page element.
*/
pageLinkClassName?: string;
/**
* The classname for the active page.
*/
activeClassName?: string;
/**
* The classname for the active link.
*/
activeLinkClassName?: string;
/**
* The classname on tag `li` of the `previous` button.
*/
previousClassName?: string;
/**
* The classname on tag `li` of the `next` button.
*/
nextClassName?: string;
/**
* The classname on tag `a` of the `previous` button.
*/
previousLinkClassName?: string;
/**
* The classname on tag `a` of the `next` button.
*/
nextLinkClassName?: string;
/**
* The classname for disabled `previous` and `next` buttons.
*/
disabledClassName?: string;
/**
* The method is called to generate the href attribute value on tag a of each page element.
*/
hrefBuilder?(pageIndex: number): void;
/**
* Extra context to add to the aria-label HTML attribute.
*/
extraAriaContext?: string;
}
interface IProps extends ReactPaginateProps {
onPageChange?: () => any;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.