I just tried to build a simple DApp using truffle, react and drizzle. My question is how to get the returned value of a smart contract function when it called by using cacheSend() in drizzle? As expected when Calling cacheCall() and cacheSend() functions on a contract, they should send the desired transaction and return a corresponding transaction hash.
In my code, cacheCall() sends the desired transaction and returns the corresponding transaction hash and when I console.log it it shows on the console. so there is no problem with cacheCall()
// this works fine
const dataKey1 = contract.methods.GetNumber.cacheCall();
console.log(dataKey1);
But cacheSend() sends the desired transaction but does not return the corresponding transaction hash !! Instead it returns the value 0 when I console.log the cacheSend() return value
// this does not work
const dataKey2 = contract.methods.setNumber.cacheSend(3);
console.log(dataKey2);
Here is the smart contract:
pragma solidity ^0.5.0;
contract Test {
uint public number = 10;
function setNumber(uint _x) public returns (uint)
{
number = number+_x;
return number + 5;
}
function GetNumber() public view returns (uint)
{
return number;
}
}
The front end should looks like the following:
The return value of GetNumber function = 13
The return value of setNumber function = 18
This is the code
import React from "react";
class TestDrizzle extends React.Component {
state = { dataKey1: null, dataKey2: null };
componentDidMount() {
const { drizzle, drizzleState } = this.props;
const contract = drizzle.contracts.Test;
// let drizzle know we want to call the `GetNumber` method with `value`
// this works fine
const dataKey1 = contract.methods.GetNumber.cacheCall();
console.log(dataKey1);
// let drizzle know we want to call the `setNumber` method with `value`
// this does not work
const dataKey2 = contract.methods.setNumber.cacheSend(3);
console.log(dataKey2);
this.setState({ dataKey1, dataKey2 });
}
render() {
// get the contract state from drizzleState
const { Test } = this.props.drizzleState.contracts;
// using the saved `dataKey1`, get the return value of GetNumber function
const result_1 = Test.GetNumber[this.state.dataKey1];
// using the saved `dataKey2`, get the return value of setNumber function
const result_2 = Test.setNumber[this.state.dataKey2];
return (
<p>
The return value of GetNumber function = {result_1 && result_1.value}{" "}
{<br />}
The return value of setNumber function = {result_2 && result_2.value}
</p>
);
}
}
export default TestDrizzle;
I would be grateful if you could have a look at my project https://github.com/fbalwy/Drizzle-tutorial.git