1

I'm facing a peculiar problem while rendering event values in a component using drizzle. When a new event is created and is updated in the events array of drizzle (drizzleState.contracts.MyContract.events), it initially shows loads of duplicate events in the array like below:

0: {logIndex: 0, transactionIndex: 0, transactionHash: "0xf45de779dc613beb7dbf548fb1a811711ec6225c30376aa14cb8989459cda146", blockHash: "0xbba89434b400d1530289369e4fec52e423ac8699f45bf19ae8004755fcdea278", blockNumber: 39, …}
1: {logIndex: 0, transactionIndex: 0, transactionHash: "0x1cd02901ca748218a0037a07294d30dc8e00a05b1e9aebeed013ffff468c1b82", blockHash: "0x08201e408f4080c1ef35ce86ace61130faf0fe821b89187969c7ae7e40b57e8a", blockNumber: 37, …}
2: {logIndex: 1, transactionIndex: 0, transactionHash: "0x1cd02901ca748218a0037a07294d30dc8e00a05b1e9aebeed013ffff468c1b82", blockHash: "0x08201e408f4080c1ef35ce86ace61130faf0fe821b89187969c7ae7e40b57e8a", blockNumber: 37, …}
3: {logIndex: 2, transactionIndex: 0, transactionHash: "0x1cd02901ca748218a0037a07294d30dc8e00a05b1e9aebeed013ffff468c1b82", blockHash: "0x08201e408f4080c1ef35ce86ace61130faf0fe821b89187969c7ae7e40b57e8a", blockNumber: 37, …}
4: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
5: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
6: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
7: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
8: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
9: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
10: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
11: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
12: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
length: 13
__proto__: Array(0)

The above code block is the brwser console log of the events array which shows duplicate items starting from index number 5 to 12. On refreshing the page (pressing F5), the duplicate events dissappear and the correct values show up:

 0: {logIndex: 0, transactionIndex: 0, transactionHash: "0xf45de779dc613beb7dbf548fb1a811711ec6225c30376aa14cb8989459cda146", blockHash: "0xbba89434b400d1530289369e4fec52e423ac8699f45bf19ae8004755fcdea278", blockNumber: 39, …}
1: {logIndex: 0, transactionIndex: 0, transactionHash: "0x0bfb0418d11eb77a8874f5f294fe83964aecdbe181f5b05c5335f625ead59d9c", blockHash: "0xf03598bdfd7de5c1e99c5ce3f429c989b515ccc5043de919956d5ef7c7ecbc98", blockNumber: 40, …}
2: {logIndex: 0, transactionIndex: 0, transactionHash: "0x1cd02901ca748218a0037a07294d30dc8e00a05b1e9aebeed013ffff468c1b82", blockHash: "0x08201e408f4080c1ef35ce86ace61130faf0fe821b89187969c7ae7e40b57e8a", blockNumber: 37, …}
3: {logIndex: 1, transactionIndex: 0, transactionHash: "0x1cd02901ca748218a0037a07294d30dc8e00a05b1e9aebeed013ffff468c1b82", blockHash: "0x08201e408f4080c1ef35ce86ace61130faf0fe821b89187969c7ae7e40b57e8a", blockNumber: 37, …}
4: {logIndex: 2, transactionIndex: 0, transactionHash: "0x1cd02901ca748218a0037a07294d30dc8e00a05b1e9aebeed013ffff468c1b82", blockHash: "0x08201e408f4080c1ef35ce86ace61130faf0fe821b89187969c7ae7e40b57e8a", blockNumber: 37, …}
length: 5
__proto__: Array(0)

This is causing the render to show duplicate values which is mitigated only when an extra refresh button is pressed in the browser. Is this a bug or am i missing something? Thanks.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.