时间戳

首页 > 解决方案 > data() 中声明的变量在监听器中未定义

javascript - data() 中声明的变量在监听器中未定义

问题描述

我在组件的 data() 部分中声明了一个“userid”变量。在mounted() 方法中，我正在启动MetaMask 的侦听器。在 MetaMask 中更改帐户后，将触发此侦听器。但是，侦听器中的“用户 ID”（在 data() 中声明）是未定义的。

 export default {
  name: 'App',
  data () {
   return {
    userid: null
   }
 },
 mounted () {
 ...
 // MetaMask Listener
 window.ethereum.on('accountsChanged', function (accounts) {
  this.userid = accounts
 })
}

我怎么解决这个问题？

标签： javascriptnode.jsvue.jsethereummetamask

解决方案

Vue 在strict模式下运行。这意味着它this绑定到常规函数本身。

你有 3 种方法来解决这个问题：

使用箭头函数：

 window.ethereum.on('accountsChanged', accounts => {
  this.userid = accounts
 })

利用.bind()

 window.ethereum.on('accountsChanged', function (accounts) {
  this.userid = accounts
 }.bind(this))

在外面声明一个变量并赋值this给它：

 var self = this;
 window.ethereum.on('accountsChanged', function (accounts) {
  self.userid = accounts
 })

推荐阅读