“EthereumProvider”类型上不存在属性“on”

Question

I'm trying to basically use the window.ethereum provider to interact with Metamask but can't set event listeners just as mentioned in the Metamask doc. I'm literally just doing this in a TypeScript class constructor: window.ethereum?.on('accountsChanged', this.handleAccountChange);

The window.ethereum provider seems ok for most of the stuff but I get that error (the title) in VSCode.

In the console when I log window.ethereum I indeed can't seen some 'on' stuff:

{_events: {…}, _eventsCount: 0, _maxListeners: 100, _log: u, _state: {…}, …}
chainId
: 
"0x89"
enable
: 
ƒ ()
id
: 
"MetaMask"
isMetaMask
: 
true
networkVersion
: 
"137"
request
: 
ƒ ()
selectedAddress
: 
"0xf2dd55f59256bd65f41d2517c27a8b5fa780a18b"
send
: 
ƒ ()
sendAsync
: 
ƒ ()
_events
: 
{}
_eventsCount
: 
0
_handleAccountsChanged
: 
ƒ ()
_handleChainChanged
: 
ƒ ()
_handleConnect
: 
ƒ ()
_handleDisconnect
: 
ƒ ()
_handleStreamDisconnect
: 
ƒ ()
_handleUnlockStateChanged
: 
ƒ ()
_jsonRpcConnection
: 
{events: o, stream: d, middleware: ƒ}
_log
: 
u {name: undefined, levels: {…}, methodFactory: ƒ, getLevel: ƒ, setLevel: ƒ, …}
_maxListeners
: 
100
_metamask
: 
Proxy {isUnlocked: ƒ, requestBatch: ƒ}
_rpcEngine
: 
s {_events: {…}, _eventsCount: 0, _maxListeners: undefined, _middleware: Array(4)}
_rpcRequest
: 
ƒ ()
_sendSync
: 
ƒ ()
_sentWarnings
: 
{enable: false, experimentalMethods: false, send: false, events: {…}}
_state
: 
accounts
: 
['0xf2dd55f59256bd65f41d2517c27a8b5fa780a18b']
initialized
: 
true
isConnected
: 
true
isPermanentlyDisconnected
: 
false
isUnlocked
: 
true
[[Prototype]]
: 
Object
_warnOfDeprecation
: 
ƒ ()
[[Prototype]]
: 
Object

Any idea? I'm lost for now...

Answer 1

your app is not connected to the metamask. Click on metamask extension and you should see this pop up

you have to manually connect