React Hook如何监听值变更触发重渲染？Solana useWallet场景问题

修复方案 #

你代码存在两处语法错误，同时要确认上下文Provider的配置：

• 布尔类型的connected直接在JSX中渲染会被React忽略，不会展示任何内容，需要转为字符串或者用三元表达式输出对应文案
• publicKey的toString是实例方法，你遗漏了执行括号()，导致当前渲染的是函数本身而非公钥文本
• 请确认TestComponent的外层已经包裹了WalletProvider，只有Provider内部的组件才能监听到Wallet上下文的状态变更触发重渲染

修复后的代码如下：

import { useWallet } from "@solana/wallet-adapter-react";

export default function TestComponent() {
    const { connected, publicKey } = useWallet();

    return (
        <div>
            <h2>Is Connect?: {connected ? '是' : '否'}</h2>
            {/* 也可以写成 {connected.toString()} 直接输出true/false */}
            <h2>Public Key: {publicKey?.toString()}</h2>
        </div>
    )
}

内容的提问来源于stack exchange，提问作者CloudL