useRequest的简单使用

import { useSet, useRequest, useToggle } from 'ahooks'; import { PageContainer } from '@ant-design/pro-components'; import { Card } from 'antd';

function getUsername() { console.log('hello,my name is LingDa'); return new Promise((res) => { setTimeout(() => { res("欸呀呀！") }, 1000) }) } export default () => { const [ready,{toggle}]=useToggle(false); const { data, loading, run, cancel } = useRequest(getUsername, { /* 轮询间隔，单位为毫秒。如果值大于 0，则启动轮询模式。 / pollingInterval: 1000, / 在页面隐藏时，是否继续轮询。 如果设置为 false，在页面隐藏时会暂时停止轮询， 页面重新显示时继续上次轮询。 / pollingWhenHidden: false, / 当请求准备好了是否准备好了 / ready, }); return ( <> <PageContainer ghost header={{ title: '轮询展示', }} > 内容:{loading ? "等待一小会":data}

ready:{JSON.stringify(ready)} {/ */} <button onClick={toggle} style={{color:"blue"}}>Toggle Ready

开始轮询 <button type='button' onClick={cancel} style={{backgroundColor:'red'}}>停止轮询 </> ); };