useChainId

Editor

function App() {
    const chainId = useChainId();
  
    return <div>{chainId}</div>;
  }

Preview

useSwitchChain

Editor

function App() {
  const switchChain = useSwitchChain();
  const [isConnected, setConnected] = useState(false);

  const handleSwitchChain = async () => {
    await switchChain(Goerli.chainId);
    setConnected(true);
  };

  return (
    <div>
      {!isConnected && (
        <div className={styles.btnContainer}>
        <div className={styles.btn} onClick={handleSwitchChain}>
          Switch to Goerli
        </div>
        </div>
      )}

      {isConnected && <ConnectWallet />}
    </div>
  );
}

Preview

Switch to Goerli

Latest Versions

Dev Dependencies