React 获取元掩码最新交易状态答案

【问题标题】：React get metamask latest transaction statusReact 获取元掩码最新交易状态
【发布时间】：2018-03-15 22:55:15
【问题描述】：

我正在使用它，通过反应中的元掩码在智能合约中进行函数调用：

export default class EthereumForm1 extends Component {
  constructor (props) {
    super (props);
    const MyContract = window.web3.eth.contract(ContractABI);

    this.state = {
      ContractInstance: MyContract.at('ContractAddress')
    }
    this.doPause = this.doPause.bind (this);
}
  doPause() {
    const { pause } = this.state.ContractInstance;

    pause (
      {
        gas: 30000,
        gasPrice: 32000000000,
        value: window.web3.toWei (0, 'ether')
      },
      (err) => {
      if (err) console.error ('Error1::::', err);
      console.log ('Contract should be paused');
    })
  }

我想要的是运行带有加载 gif 的 jQuery 代码：$(".Loading").show(); 正在处理事务并在之后将其删除。此外，最好在 div 之后添加事务状态，例如在元掩码中（通过或拒绝）。

Metamask transaction status image

【问题讨论】：

标签： reactjs web3js web3 metamask

【解决方案1】：

您不需要 jquery 来执行此操作。 React state 可以自动管理进度的状态。你所要做的就是调用setState函数。

class EthereumFrom1 extends React.Component {

    state = {
        loading: false
    };

    constructor(props) {
        super(props);

        this.doPause = this.doPause.bind(this);

    }

    doPause() {
        const {pause} = this.state.ContractInstance;

        pause(
            {
                gas: 30000,
                gasPrice: 32000000000,
                value: window.web3.toWei(0, 'ether')
            },
            (err) => {
                if (err) console.error('Error1::::', err);
                this.setState({loading: true});
            })
    }

    render() {
        return (
            <div>
                {this.state.loading ?
                    <div className="Loading">
                        Loading...
                    </div> : <div>done</div>
                }
            </div>

        )
    }
}

【讨论】：

您好，这只能进行到一半。因为当交易被挖掘时，状态不会变回（无论是成功、失败还是恢复，仍然会给出相同的结果）。

【解决方案2】：

帮助我每隔几秒检查一次我的事务是否完成，如果是则隐藏加载程序。

if (latestTx != null) {
  window.web3.eth.getTransactionReceipt(latestTx, function (error, result) {
    if (error) {
      $(".Loading").hide();
      console.error ('Error1::::', error);
    }
    console.log(result);
    if(result != null){
      latestTx = null;
      $(".Loading").hide();
    }
  });
}

【讨论】：