每当我单击connect元询问按钮时，它为什么要连接coinbase钱包？

Question

实际上，我想连接钱包，只要我按下按钮，它就会断开钱包。我曾经访问过许多网络应用，如moralis，thirdweb，coinbase，但都无法完全理解。

这些是连接到钱包的按钮。

在这里，您可以看到钱币库钱包是打开的，而我点击连接元询问。

以下是代码：

App.js

>  import { ChainId,ThirdwebProvider } from "@thirdweb-dev/react";
> function App() {   return (
>     <CanvasProvider>
>       <ChakraProvider theme={theme}>
>       <ThirdwebProvider desiredChainId={ChainId.Mainnet}>
>         <Editor />
>         </ThirdwebProvider>
>       </ChakraProvider>
>     </CanvasProvider>   ); }
> 
> export default App;

Wallet.js

import { useAddress, useDisconnect, useMetamask, useCoinbaseWallet, useWalletConnect } from "@thirdweb-dev/react";



const Wallet = () => {
    const connectWithMetamask = useMetamask();
    const connectWithCoinBase = useCoinbaseWallet()
    const connectWithWalletConnect = useWalletConnect();
    const address = useAddress();
    const disconnectWallet = useDisconnect()
    const { isOpen, onOpen, onClose } = useDisclosure()
    return (
        <>
            <Button
                onClick={onOpen}
                bgColor={'#1890ff'}
                color={'white'}
                _hover={{ bgColor: '', color: 'white' }}
            >
                Connect Wallet
            </Button>

            <Modal isOpen={isOpen} onClose={onClose} >
                <ModalOverlay />
                <ModalContent bgColor={'#001529'} textColor={'white'}>
                    <ModalHeader>Connect a Wallet</ModalHeader>
                    <ModalCloseButton />
                    <ModalBody>
                        <VStack align={'center'} justify={'center'}>
                            <Button onClick={() => connectWithMetamask()} w={'full'} bgColor={'#205375'} _hover={{ color: "#001529" }}>
                                <Stack direction={'row'} align={'center'}>
                                    <Text>Connect MetaMask</Text>
                                    <Img src={meta} boxSize={'6'} />
                                </Stack>
                            </Button>

                            <Button onClick={() => connectWithCoinBase()} w={'full'} bgColor={'#205375'} _hover={{ color: "#001529" }}>
                                <Stack direction={'row'} align={'center'}>
                                    <Text>Connect Coinbase</Text>
                                    <Img src={coinbase} boxSize={'6'} />

                                </Stack>

                            </Button>

                            <Button onClick={() => connectWithWalletConnect()} w={'full'} bgColor={'#205375'} _hover={{ color: "#001529" }}>
                                <Stack direction={'row'} align={'center'}>
                                    <Text> Connect WalletConnect</Text>
                                    <Img src={coinbase} boxSize={'6'} />
                                </Stack>
                            </Button>


                            <Button onClick={disconnectWallet} w={'full'} bgColor={'#205375'} _hover={{ color: "#001529" }}>
                                <Stack direction={'row'} align={'center'}>
                                    <Text> Disconnect Wallet</Text>

                                </Stack>

                            </Button>
                        </VStack>
                    </ModalBody>
                </ModalContent>
            </Modal>
        </>
    )
}

Answer 1

MetaMask和Coinbase钱包都使用“注入的”Ethereum提供者，当您在同一个浏览器中同时安装Coinbase和MetaMask时，您看到的错误就会发生。

未来版本的第三now将修复这种行为，但现在这是您看到错误的原因。

我的建议是只使用任何一个钱包连接器，但不能同时使用，直到它是固定的。