How to display object inside of a function in React?

Moralis General
#1

Hello,
I can’t access to “transaction” object from outside of a function, i just want to display transaction details on the screen.
I can see the response into browser’s network tab but can’t display on the page.
Here is my code:

import React from "react";
import { useMoralisWeb3Api } from "react-moralis";

const GetTransaction = () => {
  const Web3Api = useMoralisWeb3Api();

  const options = {
    chain: "eth",
    transaction_hash:
      "0x5e519cd5117aea6ed9d51d4f235b4badb2e3f69377a4e2f945e13feb20af4db3",
  };

  const fetchTransaction = async () => {
    const transaction = await Web3Api.native.getTransaction(options);
    return <h1> {JSON.stringify(transaction)} </h1>;
  };

  return (
    <div>
      <button onClick={() => fetchTransaction()}>
        Get Transaction Details
      </button>
    </div>
  );
};

export default GetTransaction;
#2

maybe you can use useState and useEffect

1 Like
#3

I handled it with useState, thanks :slight_smile:

1 Like