mutate(key) 全局的向所有具有相同 key 的 SWR 广播重新验证消息

代码

import useSWR, {mutate} from 'swr';
import {Divider, Avatar, Skeleton, Button} from 'antd';
const KEY = 'api/user'
function fetchUser() {
  return fetch(KEY).then(res => (res.json()))
}
const MyAvatar = () => {
  const { data, error } = useSWR(KEY, fetchUser);
  if (data && !error) {
    return (
      <Avatar src={data.avatar} />
    )
  }
  return (
    <Skeleton.Avatar active shape="circle" />
  )
}
const Content = () => {
  const {data} = useSWR(KEY, fetchUser);
  return (
    <h1>
      welcome {data && data.name ? data.name : '--'}
    </h1>
  )
}
export default function IndexPage() {
  return (
    <div style={{textAlign: 'center'}}>
      <div style={{textAlign: 'right', padding: '24px 24px 0 0'}}>
        <MyAvatar />
      </div>
      <Divider />
      <Content />
      <Button type="primary" onClick={() => mutate(KEY)} >刷新</Button>
    </div>
  );
}

结果