尧图网站建设 
wagmi wagmi/solid useDisconnect 原语完全指南在 Solid.js 应用中安全断开钱包连接【免费下载链接】wagmiReactive primitives for Ethereum apps项目地址: https://gitcode.com/GitHub_Trending/wa/wagmiuseDisconnect是wagmi/solid包提供的 mutation 类原语primitive用于在 Solid.js 应用中主动断开当前或指定连接器与钱包的连接。本文基于官方文档 useDisconnect 说明 展开并结合仓库中的实际源码实现与测试用例完整覆盖其导入方式、参数体系getter 参数模式、config覆盖、mutation 选项、返回类型字段以及底层disconnectaction 对多连接状态机、事件监听器和 recentConnector 存储的处理逻辑帮助你在 Solid 项目中正确、可复现地实现连接断开功能。一、原语定位与导入useDisconnect位于packages/solid/src/primitives目录与useConnect、useReconnect、useSwitchConnection等连接管理类原语并列。它本质上是对底层disconnectaction 的响应式封装内部通过 TanStack Query for Solid 的createMutation创建一个可触发、带状态跟踪pending/error/success的 mutation从而让断开连接这一写操作拥有完整的生命周期状态可供 UI 绑定。导入方式如下import { useDisconnect } from wagmi/solid最小可用示例import { useDisconnect } from wagmi/solid function App() { const disconnect useDisconnect() return ( button onClick{() disconnect.mutate()} Disconnect /button ) }该原语运行需要Config实例。仓库中 Solid 侧的标准配置示例见 solid config 片段import { createConfig, http } from wagmi/solid import { mainnet, sepolia } from wagmi/solid/chains export const config createConfig({ chains: [mainnet, sepolia], transports: { [mainnet.id]: http(), [sepolia.id]: http(), }, })配置一般通过WagmiProvider参见 WagmiProvider 文档注入到组件树应用完整可运行的写法可参考 solid-start playground。二、Parameters以 getter 函数传参维持 Solid 响应性useDisconnect的参数类型声明为useDisconnect.Parameters useDisconnect.SolidParameters其中SolidParameters是ConfigParameter DisconnectOptionscontext的Compute计算结果见 useDisconnect.ts。与 React 版本直接接收对象不同Solid 的 wagmi 原语要求参数以 getter 函数传入以便在createMutation内部按需、响应式地读取参数值useDisconnect(() ({ config, // mutation options... }))从 实现源码 可以看到这一约定export function useDisconnectcontext unknown( parameters: useDisconnect.Parameterscontext () ({}), ): useDisconnect.ReturnTypecontext { const config useConfig(parameters) const mutation useMutation(() disconnectMutationOptions(config(), parameters()), ) return mutation as useDisconnect.ReturnTypecontext }parameters的默认值是() ({})因此useDisconnect()可以不传参数直接调用每次 mutation 选项重建时getter 都会被重新求值这就是 Solid 响应性得以贯通的关键。config 参数Config | undefinedConfig类型用于覆盖从最近WagmiProvider上下文获取的配置。解析逻辑在 useConfig.ts 中实现优先取parameters().config否则从WagmiContext读取两者都没有时抛出WagmiProviderNotFoundError。也就是说只有当你持有独立于 Provider 的 config 实例如测试或多配置场景时才需要显式传入。mutation 参数TanStack Query 选项SolidParameters中还包含 TanStack Query 的 mutation 选项以下选项受支持选项类型说明gcTimenumber \| Infinity \| undefined缓存未被使用后在内存中保留的毫秒时长设为Infinity则禁用垃圾回收metaRecordstring, unknown \| undefined附加到 mutation 缓存条目的元信息可在onError/onSuccess等回调中通过 context 访问networkModeonline \| always \| offlineFirst \| undefined默认online控制 mutation 与网络状态的关系onError(error, variables, context?) Promiseunknown \| unknownmutation 失败时触发接收错误对象onMutate(variables) Promisecontext \| void \| context \| voidmutation 执行前触发可用于乐观更新返回值会传递给onError和onSettled以便回滚onSuccess(data, variables, context?) Promiseunknown \| unknownmutation 成功后触发接收结果onSettled(data, error, variables, context?) Promiseunknown \| unknown无论成功或失败都会触发queryClientQueryClient使用自定义QueryClient否则使用最近上下文中提供的实例retryboolean \| number \| ((failureCount, error) boolean)默认0false不重试true无限重试数字为最大失败次数retryDelaynumber \| ((retryAttempt, error) number)指定重试前等待的毫秒数可用函数实现线性/指数退避需要特别注意的限制wagmi 不允许覆盖所有 TanStack Query 参数。从 solid 侧查询工具类型 可以看到SolidMutationParameters显式剔除了mutationFn、mutationKey和throwOnError三个字段——它们在 wagmi 内部使用用于装配 mutation 行为用户传入会被忽略。完整的选项说明可参考共享文档 mutation-options。三、Return Type完整的 mutation 状态对象返回类型声明为useDisconnect.ReturnType从类型定义看它由UseMutationReturnTypeDisconnectData, DisconnectErrorType, DisconnectVariables, context, DisconnectMutate, DisconnectMutateAsync计算而来见 useDisconnect.ts其中TData为void、TError为DisconnectErrorType、TVariables为{ connector?: Connector | undefined }。主要字段如下字段类型说明mutate(variables: TVariables, { onSuccess, onSettled, onError }) void触发断开连接的入口函数。variables即传给底层disconnectaction 的参数回调与参数侧选项等价仅作用于本次调用mutateAsync(variables, { onSuccess, onSettled, onError }) PromiseTData同mutate但返回可await的 Promisedatavoid \| undefined上次成功 resolve 的数据disconnect 无返回值恒为undefinederrorDisconnectErrorType \| null上次尝试的错误对象failureCountnumber失败次数每次失败递增成功后归零failureReasonDisconnectErrorType \| null触发重试的失败原因成功后重置为nullisError/isIdle/isPending/isSuccessboolean由status派生的布尔标志isPausedbooleanmutation 处于 paused 状态网络模式相关时为truereset() void将 mutation 内部状态重置回初始状态statusidle \| pending \| error \| successidle初始态pending执行中error最近一次失败success最近一次成功submittedAtnumbermutation 提交时间戳默认0variablesTVariables \| undefined传给mutate的 variables默认undefined典型的 UI 用法用disconnect.isPending禁用按钮防止重复点击用onSuccess/onSettled回调或 Solid 信号观察status更新连接面板。更完整的字段说明见共享文档 mutation-result。错误类型DisconnectErrorType在 core 的 disconnect action 中定义为export type DisconnectErrorType | ConnectorNotFoundErrorType | ConnectorNotConnectedErrorType // base | BaseErrorType | ErrorType即可能遇到连接器不存在connector参数指向未注册的 uid或连接器未连接当前连接状态不是 connected等具体错误以及基础错误类型。处理断开连接错误时可据此做类型收窄。四、源码纵深从原语到 action 的完整调用链useDisconnect的完整调用链为useDisconnectsolid primitive→disconnectMutationOptionsquery 层→disconnectcore action。逐层拆解如下。1. mutation 装配层disconnectMutationOptionscore 的 query 层实现export function disconnectMutationOptionsconfig extends Config, context( config: config, options: DisconnectOptionscontext {}, ): DisconnectMutationOptions { return { ...(options.mutation as any), mutationFn: async (variables) { return disconnect(config, variables) }, mutationKey: [disconnect], } }两个要点一是用户的mutation选项被展开在前mutationFn与mutationKey由 wagmi 固定写入这解释了为何这两个字段不可覆盖二是mutationKey恒为[disconnect]即所有useDisconnect调用共享同一个 mutation 缓存条目。DisconnectData DisconnectReturnType即voidDisconnectVariables DisconnectParameters | undefined即可选的{ connector }。2. action 层disconnect的状态机逻辑core action 实现 是整个断开的核心逻辑分四步解析目标 connector若parameters.connector存在则使用它否则从config.state中读取当前连接connections.get(current)对应的 connector。断开并重新绑定监听器调用connector.disconnect()后移除该 connector 上change和disconnect事件对 config 内部 handler 的订阅但重新挂载connect事件——这样钱包再次连接时能恢复状态同步而不是死掉。更新连接状态机从connectionsMap 中删除该连接后config.setState分两种情况若已无任何连接connections.size 0整体进入disconnected状态current置null若仍有多连接multi-account 场景自动切换到 Map 中剩余的下一个连接current指向它的 uid。持久化 recent connector若断开后仍存在current连接则把当前 connector 的id写入config.storage的recentConnectorId供下次useConnect时的最近使用推荐。从源码结构看disconnect是幂等且安全的即使传入一个未连接的 connector uid也不会抛出异常而是走无操作分支——但类型层面仍保留了ConnectorNotFoundErrorType等错误声明供调用方做防御式处理。3. 参数 getter 为何是必须的回到 solid primitive 实现useMutation(() disconnectMutationOptions(config(), parameters()))把config()与parameters()都放在 getter 内意味着 TanStack Solid 的 mutation 选项会在其依赖变化时重新计算——如果你在 getter 中引用了会变化的信号例如动态选择的 config 或条件性 mutation 选项mutation 会自动跟随更新。这是 Solid 版本 wagmi 与 React 版本在参数传递上的本质差异。五、测试验证断开后连接状态如何变化useDisconnect 的测试用例 验证了完整的断开语义test(default, async () { const { result } renderPrimitive(() ({ useConnection: useConnection(), useDisconnect: useDisconnect(), })) expect(result.useConnection().address).toBeDefined() expect(result.useConnection().status).toEqual(connected) result.useDisconnect.mutate() await vi.waitFor(() expect(result.useConnection().isDisconnected).toBeTruthy(), ) expect(result.useConnection().address).not.toBeDefined() expect(result.useConnection().status).toEqual(disconnected) })测试流程beforeEach中先用wagmi/core的connectaction 建立连接config.connectors[0]断言useConnection状态为connected且address有值随后调用result.useDisconnect.mutate()不传 variables即断开当前连接最后断言useConnection转为isDisconnected、address为undefined、status为disconnected。这个用例恰好印证了第四节的结论断开后连接被从connectionsMap 中移除config 状态回到disconnected且这一变化是响应式地暴露给所有观察连接状态的原语如useConnection的。六、与 TanStack Query 的类型协作如果你需要在非 Solid 场景如 Solid 组件外的普通代码复用断开逻辑或想在自己的 SolidQuery 工具中复用这些类型wagmi/solid/query子路径导出了 disconnect 相关的完整类型集见共享文档 mutation-imports 的模式对应 solid 包的实际导出import { type DisconnectData, type DisconnectVariables, type DisconnectMutate, type DisconnectMutateAsync, disconnectMutationOptions, } from wagmi/solid/query其中disconnectMutationOptions(config, options)可脱离原语单独用于手动装配createMutation而DisconnectMutate/DisconnectMutateAsync是注入到返回类型中的精确mutate/mutateAsync函数签名类型。七、小结导入与调用import { useDisconnect } from wagmi/soliddisconnect.mutate()断开当前连接disconnect.mutateAsync({ connector })可断开指定连接器并等待完成。参数必须以 getter 函数传入config用于覆盖 Provider 配置支持完整 TanStack Query mutation 选项但mutationFn、mutationKey、throwOnError不可覆盖。返回标准 mutation 状态对象status/isPending/error/mutate/mutateAsync/reset等TData为void。底层行为断开指定或当前 connector、重绑connect监听以支持重连、按多连接情况切换current或回到disconnected、并持久化recentConnectorId。参考路径文档 useDisconnect.md、原语 useDisconnect.ts、query 层 disconnect.ts、action disconnect.ts、测试 useDisconnect.test.ts、底层 action 文档 disconnect。【免费下载链接】wagmiReactive primitives for Ethereum apps项目地址: https://gitcode.com/GitHub_Trending/wa/wagmi创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 wagmi @wagmi/solid useDisconnect 原语完全指南：在 Solid.js 应用中安全断开钱包连接
wagmi wagmi/solid useDisconnect 原语完全指南在 Solid.js 应用中安全断开钱包连接【免费下载链接】wagmiReactive primitives for Ethereum apps项目地址: https://gitcode.com/GitHub_Trending/wa/wagmiuseDisconnect是wagmi/solid包提供的 mutation 类原语primitive用于在 Solid.js 应用中主动断开当前或指定连接器与钱包的连接。本文基于官方文档 useDisconnect 说明 展开并结合仓库中的实际源码实现与测试用例完整覆盖其导入方式、参数体系getter 参数模式、config覆盖、mutation 选项、返回类型字段以及底层disconnectaction 对多连接状态机、事件监听器和 recentConnector 存储的处理逻辑帮助你在 Solid 项目中正确、可复现地实现连接断开功能。一、原语定位与导入useDisconnect位于packages/solid/src/primitives目录与useConnect、useReconnect、useSwitchConnection等连接管理类原语并列。它本质上是对底层disconnectaction 的响应式封装内部通过 TanStack Query for Solid 的createMutation创建一个可触发、带状态跟踪pending/error/success的 mutation从而让断开连接这一写操作拥有完整的生命周期状态可供 UI 绑定。导入方式如下import { useDisconnect } from wagmi/solid最小可用示例import { useDisconnect } from wagmi/solid function App() { const disconnect useDisconnect() return ( button onClick{() disconnect.mutate()} Disconnect /button ) }该原语运行需要Config实例。仓库中 Solid 侧的标准配置示例见 solid config 片段import { createConfig, http } from wagmi/solid import { mainnet, sepolia } from wagmi/solid/chains export const config createConfig({ chains: [mainnet, sepolia], transports: { [mainnet.id]: http(), [sepolia.id]: http(), }, })配置一般通过WagmiProvider参见 WagmiProvider 文档注入到组件树应用完整可运行的写法可参考 solid-start playground。二、Parameters以 getter 函数传参维持 Solid 响应性useDisconnect的参数类型声明为useDisconnect.Parameters useDisconnect.SolidParameters其中SolidParameters是ConfigParameter DisconnectOptionscontext的Compute计算结果见 useDisconnect.ts。与 React 版本直接接收对象不同Solid 的 wagmi 原语要求参数以 getter 函数传入以便在createMutation内部按需、响应式地读取参数值useDisconnect(() ({ config, // mutation options... }))从 实现源码 可以看到这一约定export function useDisconnectcontext unknown( parameters: useDisconnect.Parameterscontext () ({}), ): useDisconnect.ReturnTypecontext { const config useConfig(parameters) const mutation useMutation(() disconnectMutationOptions(config(), parameters()), ) return mutation as useDisconnect.ReturnTypecontext }parameters的默认值是() ({})因此useDisconnect()可以不传参数直接调用每次 mutation 选项重建时getter 都会被重新求值这就是 Solid 响应性得以贯通的关键。config 参数Config | undefinedConfig类型用于覆盖从最近WagmiProvider上下文获取的配置。解析逻辑在 useConfig.ts 中实现优先取parameters().config否则从WagmiContext读取两者都没有时抛出WagmiProviderNotFoundError。也就是说只有当你持有独立于 Provider 的 config 实例如测试或多配置场景时才需要显式传入。mutation 参数TanStack Query 选项SolidParameters中还包含 TanStack Query 的 mutation 选项以下选项受支持选项类型说明gcTimenumber \| Infinity \| undefined缓存未被使用后在内存中保留的毫秒时长设为Infinity则禁用垃圾回收metaRecordstring, unknown \| undefined附加到 mutation 缓存条目的元信息可在onError/onSuccess等回调中通过 context 访问networkModeonline \| always \| offlineFirst \| undefined默认online控制 mutation 与网络状态的关系onError(error, variables, context?) Promiseunknown \| unknownmutation 失败时触发接收错误对象onMutate(variables) Promisecontext \| void \| context \| voidmutation 执行前触发可用于乐观更新返回值会传递给onError和onSettled以便回滚onSuccess(data, variables, context?) Promiseunknown \| unknownmutation 成功后触发接收结果onSettled(data, error, variables, context?) Promiseunknown \| unknown无论成功或失败都会触发queryClientQueryClient使用自定义QueryClient否则使用最近上下文中提供的实例retryboolean \| number \| ((failureCount, error) boolean)默认0false不重试true无限重试数字为最大失败次数retryDelaynumber \| ((retryAttempt, error) number)指定重试前等待的毫秒数可用函数实现线性/指数退避需要特别注意的限制wagmi 不允许覆盖所有 TanStack Query 参数。从 solid 侧查询工具类型 可以看到SolidMutationParameters显式剔除了mutationFn、mutationKey和throwOnError三个字段——它们在 wagmi 内部使用用于装配 mutation 行为用户传入会被忽略。完整的选项说明可参考共享文档 mutation-options。三、Return Type完整的 mutation 状态对象返回类型声明为useDisconnect.ReturnType从类型定义看它由UseMutationReturnTypeDisconnectData, DisconnectErrorType, DisconnectVariables, context, DisconnectMutate, DisconnectMutateAsync计算而来见 useDisconnect.ts其中TData为void、TError为DisconnectErrorType、TVariables为{ connector?: Connector | undefined }。主要字段如下字段类型说明mutate(variables: TVariables, { onSuccess, onSettled, onError }) void触发断开连接的入口函数。variables即传给底层disconnectaction 的参数回调与参数侧选项等价仅作用于本次调用mutateAsync(variables, { onSuccess, onSettled, onError }) PromiseTData同mutate但返回可await的 Promisedatavoid \| undefined上次成功 resolve 的数据disconnect 无返回值恒为undefinederrorDisconnectErrorType \| null上次尝试的错误对象failureCountnumber失败次数每次失败递增成功后归零failureReasonDisconnectErrorType \| null触发重试的失败原因成功后重置为nullisError/isIdle/isPending/isSuccessboolean由status派生的布尔标志isPausedbooleanmutation 处于 paused 状态网络模式相关时为truereset() void将 mutation 内部状态重置回初始状态statusidle \| pending \| error \| successidle初始态pending执行中error最近一次失败success最近一次成功submittedAtnumbermutation 提交时间戳默认0variablesTVariables \| undefined传给mutate的 variables默认undefined典型的 UI 用法用disconnect.isPending禁用按钮防止重复点击用onSuccess/onSettled回调或 Solid 信号观察status更新连接面板。更完整的字段说明见共享文档 mutation-result。错误类型DisconnectErrorType在 core 的 disconnect action 中定义为export type DisconnectErrorType | ConnectorNotFoundErrorType | ConnectorNotConnectedErrorType // base | BaseErrorType | ErrorType即可能遇到连接器不存在connector参数指向未注册的 uid或连接器未连接当前连接状态不是 connected等具体错误以及基础错误类型。处理断开连接错误时可据此做类型收窄。四、源码纵深从原语到 action 的完整调用链useDisconnect的完整调用链为useDisconnectsolid primitive→disconnectMutationOptionsquery 层→disconnectcore action。逐层拆解如下。1. mutation 装配层disconnectMutationOptionscore 的 query 层实现export function disconnectMutationOptionsconfig extends Config, context( config: config, options: DisconnectOptionscontext {}, ): DisconnectMutationOptions { return { ...(options.mutation as any), mutationFn: async (variables) { return disconnect(config, variables) }, mutationKey: [disconnect], } }两个要点一是用户的mutation选项被展开在前mutationFn与mutationKey由 wagmi 固定写入这解释了为何这两个字段不可覆盖二是mutationKey恒为[disconnect]即所有useDisconnect调用共享同一个 mutation 缓存条目。DisconnectData DisconnectReturnType即voidDisconnectVariables DisconnectParameters | undefined即可选的{ connector }。2. action 层disconnect的状态机逻辑core action 实现 是整个断开的核心逻辑分四步解析目标 connector若parameters.connector存在则使用它否则从config.state中读取当前连接connections.get(current)对应的 connector。断开并重新绑定监听器调用connector.disconnect()后移除该 connector 上change和disconnect事件对 config 内部 handler 的订阅但重新挂载connect事件——这样钱包再次连接时能恢复状态同步而不是死掉。更新连接状态机从connectionsMap 中删除该连接后config.setState分两种情况若已无任何连接connections.size 0整体进入disconnected状态current置null若仍有多连接multi-account 场景自动切换到 Map 中剩余的下一个连接current指向它的 uid。持久化 recent connector若断开后仍存在current连接则把当前 connector 的id写入config.storage的recentConnectorId供下次useConnect时的最近使用推荐。从源码结构看disconnect是幂等且安全的即使传入一个未连接的 connector uid也不会抛出异常而是走无操作分支——但类型层面仍保留了ConnectorNotFoundErrorType等错误声明供调用方做防御式处理。3. 参数 getter 为何是必须的回到 solid primitive 实现useMutation(() disconnectMutationOptions(config(), parameters()))把config()与parameters()都放在 getter 内意味着 TanStack Solid 的 mutation 选项会在其依赖变化时重新计算——如果你在 getter 中引用了会变化的信号例如动态选择的 config 或条件性 mutation 选项mutation 会自动跟随更新。这是 Solid 版本 wagmi 与 React 版本在参数传递上的本质差异。五、测试验证断开后连接状态如何变化useDisconnect 的测试用例 验证了完整的断开语义test(default, async () { const { result } renderPrimitive(() ({ useConnection: useConnection(), useDisconnect: useDisconnect(), })) expect(result.useConnection().address).toBeDefined() expect(result.useConnection().status).toEqual(connected) result.useDisconnect.mutate() await vi.waitFor(() expect(result.useConnection().isDisconnected).toBeTruthy(), ) expect(result.useConnection().address).not.toBeDefined() expect(result.useConnection().status).toEqual(disconnected) })测试流程beforeEach中先用wagmi/core的connectaction 建立连接config.connectors[0]断言useConnection状态为connected且address有值随后调用result.useDisconnect.mutate()不传 variables即断开当前连接最后断言useConnection转为isDisconnected、address为undefined、status为disconnected。这个用例恰好印证了第四节的结论断开后连接被从connectionsMap 中移除config 状态回到disconnected且这一变化是响应式地暴露给所有观察连接状态的原语如useConnection的。六、与 TanStack Query 的类型协作如果你需要在非 Solid 场景如 Solid 组件外的普通代码复用断开逻辑或想在自己的 SolidQuery 工具中复用这些类型wagmi/solid/query子路径导出了 disconnect 相关的完整类型集见共享文档 mutation-imports 的模式对应 solid 包的实际导出import { type DisconnectData, type DisconnectVariables, type DisconnectMutate, type DisconnectMutateAsync, disconnectMutationOptions, } from wagmi/solid/query其中disconnectMutationOptions(config, options)可脱离原语单独用于手动装配createMutation而DisconnectMutate/DisconnectMutateAsync是注入到返回类型中的精确mutate/mutateAsync函数签名类型。七、小结导入与调用import { useDisconnect } from wagmi/soliddisconnect.mutate()断开当前连接disconnect.mutateAsync({ connector })可断开指定连接器并等待完成。参数必须以 getter 函数传入config用于覆盖 Provider 配置支持完整 TanStack Query mutation 选项但mutationFn、mutationKey、throwOnError不可覆盖。返回标准 mutation 状态对象status/isPending/error/mutate/mutateAsync/reset等TData为void。底层行为断开指定或当前 connector、重绑connect监听以支持重连、按多连接情况切换current或回到disconnected、并持久化recentConnectorId。参考路径文档 useDisconnect.md、原语 useDisconnect.ts、query 层 disconnect.ts、action disconnect.ts、测试 useDisconnect.test.ts、底层 action 文档 disconnect。【免费下载链接】wagmiReactive primitives for Ethereum apps项目地址: https://gitcode.com/GitHub_Trending/wa/wagmi创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考