0
import { useState } from "react";
import "./Display.css";
const Display = ({ contract, account }) => {
    const [data, setData] = useState("")
    const getdata = async () => {
        let dataArray;
        const OtherAddress = document.querySelector(".address").value;
        try {
            if (OtherAddress) {
              dataArray = await contract.display(OtherAddress);
              console.log(dataArray);
            } else {
              dataArray = await contract.display(account);
            }
          } catch (e) {
            alert("You don't have access");
          }                                                                                  
        const isEmpty = Object.keys(dataArray).length === 0;

        if (!isEmpty) {
            const str = dataArray.toString();
            const str_array = str.split(",");
            console.log(str);
            console.log(str_array);
            const images = str_array.map((item, i) => {
                return (
                    <a href={item} key={i} target="_blank">
                        <img key={i} src={`https://gateway.pinata.cloud/ipfs/${item.substring(6)}`}
                            alt="new"
                            className="image-list"
                        ></img> 
                    </a>
                )
            })
            setData(images);
        }
        else {
            alert("No Image to display");
        }
    };
    return (
        <>
            <div className="image-list">{data}</div>
            <input type="text" placeholder="Enter Address" className="address"></input>
            <button className="center button" onClick={getdata}>
                Get Data
            </button>
        </>
    )
}

export default Display;

error when try catch block ->

Cannot convert undefined or null to object and if i remove try catch block this is the error it shows ->

call revert exception [ See: https://links.ethers.org/v5-errors-CALL_EXCEPTION ] (method="display(address)", data="0x", errorArgs=null, errorName=null, errorSignature=null, reason=null, code=CALL_EXCEPTION, version=abi/5.7.0)

1 Answer 1

0

From the error it sounds like its more related to display(address) but let us know if you need more assistance with the upload part! We have some React examples here as well as an Next.js Template you can spin up with npx create-pinata-app

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.