Getting error : Uncaught TypeError: Cannot read properties of undefined (reading 'realEstate') at loadBlockchainData (App.js:31:1)

[Rackr7642]

Full Error: p.js:31 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'realEstate')
at loadBlockchainData (App.js:31:1)
l

IDK why am I getting this error even though my syntax in right and I am doing exactly as shown in the video. Even after copying the code the error still doesn't resolve. Its fetching the data for the escrow one but not for the realEstate one.
Please help!

[AkinolaAkintunde]

Replace your loadBlockchaininData with this
' const loadBlockchainData = async () => {
try {
const provider = new ethers.providers.Web3Provider(window.ethereum);
setProvider(provider);

  const network = await provider.getNetwork();
  const chainId = network.chainId;

  const contractAddresses = config[chainId];
  if (!contractAddresses) {
    throw new Error(`No contract addresses found for chainId ${chainId}`);
  }

  const realEstate = new ethers.Contract(contractAddresses.realEstate.address, RealEstate, provider);
  const totalSupply = await realEstate.totalSupply();
  const homes = [];

  for (var i = 1; i <= totalSupply; i++) {
    const uri = await realEstate.tokenURI(i);
    const response = await fetch(uri);
    const metadata = await response.json();
    homes.push(metadata);
  }

  setHomes(homes)

  const escrow = new ethers.Contract(contractAddresses.escrow.address, Escrow, provider);
  setEscrow(escrow);

  window.ethereum.on('accountsChanged', async () => {
    const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
    const account = ethers.utils.getAddress(accounts[0])
    setAccount(account);
  });
} catch (error) {
  console.error("Error loading blockchain data:", error);
}

};'

[sandhu28]

You probably have not configured yout metamask properly. Watch the video at timestamp 1:32:00, and configure your hardhat, then follow the steps from running the command "npx hardhat node".

[elvisisvan]

You probably have not configured yout metamask properly. Watch the video at timestamp 1:32:00, and configure your hardhat, then follow the steps from running the command "npx hardhat node".

thank you, have you got it run and deploy smoothly?

[elvisisvan]

Replace your loadBlockchaininData with this ' const loadBlockchainData = async () => { try { const provider = new ethers.providers.Web3Provider(window.ethereum); setProvider(provider);

  const network = await provider.getNetwork();
  const chainId = network.chainId;

  const contractAddresses = config[chainId];
  if (!contractAddresses) {
    throw new Error(`No contract addresses found for chainId ${chainId}`);
  }

  const realEstate = new ethers.Contract(contractAddresses.realEstate.address, RealEstate, provider);
  const totalSupply = await realEstate.totalSupply();
  const homes = [];

  for (var i = 1; i <= totalSupply; i++) {
    const uri = await realEstate.tokenURI(i);
    const response = await fetch(uri);
    const metadata = await response.json();
    homes.push(metadata);
  }

  setHomes(homes)

  const escrow = new ethers.Contract(contractAddresses.escrow.address, Escrow, provider);
  setEscrow(escrow);

  window.ethereum.on('accountsChanged', async () => {
    const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
    const account = ethers.utils.getAddress(accounts[0])
    setAccount(account);
  });
} catch (error) {
  console.error("Error loading blockchain data:", error);
}

};'

basically wrap the entire loadBlockchainData property with a trycatch snippet, right?

[Electrolight123]

Error: Uncaught TypeError: Cannot read properties of undefined (reading 'realEstate')
Root cause: Dapp is on the wrong network or config.json doesn’t have the current deployed addresses.

Fixes I applied:

Local deploy:

npx hardhat node
npx hardhat run scripts/deploy.js --network localhost

Put the printed addresses into src/config.json under chainId 31337.

Guard in App.js:

const network = await provider.getNetwork();
if (!config[network.chainId]) {
alert('Switch MetaMask to localhost 31337');
return;
}

BigNumber → number:

const totalSupply = (await realEstate.totalSupply()).toNumber();

If images/data don’t load: mint with your own IPFS CID in scripts/deploy.js (set BASE = 'ipfs://') and redeploy. Gateways can cache, so append ?t=${Date.now()} when fetching metadata.

✅ My working repo (with all fixes): https://github.com/Electrolight123/Deedmint-real-estate-dapp

Hope this helps others stuck on this!

[Electrolight123]

Full Error: p.js:31 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'realEstate') at loadBlockchainData (App.js:31:1) l

IDK why am I getting this error even though my syntax in right and I am doing exactly as shown in the video. Even after copying the code the error still doesn't resolve. Its fetching the data for the escrow one but not for the realEstate one. Please help!

https://github.com/Electrolight123/Deedmint-real-estate-dapp