传播不可迭代实例的尝试无效。为了可迭代，非数组对象必须具有 [Symbol.iterator]() 方法

Posted 2023-02-18

【中文标题】传播不可迭代实例的尝试无效。为了可迭代，非数组对象必须具有 [Symbol.iterator]() 方法

【英文标题】：Invalid attempt to spread non-iterable instance.In order to be iterable, non-array objects must have a [Symbol.iterator]() method

【发布时间】：2021-11-15 03:30:13

【问题描述】：

data()
    return 
        tables:[]
    
,
mounted()
    this.getData()
,
methods:
    getData()
        var subscription = web3.eth.subscribe('logs', 
            address: '0x123456..',
            topics: ['0x12345...']
        , function(error, result)
            if (!error)
                console.log(result);
        )
        .on("data", function(log)
            // this.tables return the error message typeError: Invalid attempt to spread non-iterable instance.In order to be iterable, non-array objects must have a [Symbol.iterator]() method
            this.tables = [...log]
        )
    

在 vue JS 中我无法访问填充 this.tables 以获取数据还有什么其他方法可以做到这一点？

【问题讨论】：

log 变量在 .on("data", function(log) 中是什么样的？我认为它不能用像 [..log] developer.mozilla.org/en-US/docs/Web/javascript/Reference/…

这样的传播运算符传播

日志只是一个返回的数据，我没有问题，但问题是“this.tables”似乎我无法通过那里，所以即使我做了 console.log( this.tables) 它返回 undefined

log是什么数据？是字符串还是数字？

对象数据类型

如果它是一个对象，我认为你不能将一个对象传播到一个数组中。

【参考方案1】：

这里的'this.tables'表示回调函数的表，回调中的'this'不针对vue数据。

在mounted()中尝试this.getData(this.tables)。

和getData(tables) 在方法中，

那么回调应该是 function(log, tables) tables = [...log]

【讨论】：

是的，您知道更好的方法吗？为“log”中的数据填充“this.table”？

对我来说只是一个提示就可以了

@MilesSelim 抱歉，我刚刚编辑了它，我提交了一个不完整的答案

您好，我尝试了您的方法，但仍然无法正常工作，“this.tables”仍然为空，但“tables”变量已被填充

【参考方案2】：

好的，我现在想通了，所以解决方案是

const self = this
var subscription = web3.eth.subscribe('logs', 
            address: '0x123456..',
            topics: ['0x12345...']
        , function(error, result)
            if (!error)
                console.log(result);
        )
        .on("data", function(log)

            self.tables.push(log)
        )