How to use web3-react

The following information is deprecated and may limit its use. Please refer to the WalletConnect 2.0 tab for the latest version of NEOPIN wallet integration: WalletConnect 2.0

  • You can easily get the desired value by using the wrapped 'web3-react'.


npm i nptconnect-web3react-walletconnect-connector


yarn add nptconnect-web3react-walletconnect-connector


You can export the connector and use without using nptconnect-client or nptconnect-core(Called from inside).

import { WalletConnectConnector } from 'nptconnect-web3react-walletconnect-connector';
const POLLING_INTERVAL = 12000; 

export const connector = new WalletConnectConnector({
  rpc: { [chainId]: rpcUrl },
  qrcode: true,
  pollingInterval: POLLING_INTERVAL, // optional
} as any);

The necessary information can be checked and used through the useWeb3React method as shown below.

import { UnsupportedChainIdError, useWeb3React } from '@web3-react/core';
const { chainId, activate, deactivate, setError, account, active } = useWeb3React();


In order to connect the Wallet to the DApp, a connector matching the Wallet must be passed to the activate function.

activate: (connector: AbstractConnector, onError?: (error: Error) => void, throwErrors?: boolean) => Promise<void>;
setError: (error: Error) => void;
deactivate: () => void; //Function to disconnect DApp Wallet

connector?: AbstractConnector; //Connector value of the Wallet currently connected to DApp
library?: T; //Provide Web3 provider
chainId?: number; //chainId of account connected to DApp
account?: null | string;  //Account address connected to DApp. When attached to the Bridge Server: string, Default: null
active: boolean; //Check if the DApp user is logged in. When connecting with a Bridge Server: true, Default: false
error?: Error; 

Last updated