Lesson:10 TypeError: Cannot read properties of undefined (reading 'toString')

[Sunil-Reddy-Gummalla]

Hi I am getting this Below Error on UI

When I tried to Remove the .toString()
It is Throwing Another Error

TypeError: setEntranceFee is not a function

I followed #1054 not helped
Note : Previously I am Raised one discussion #1147 Because of that I Copied my abi and ContractAddress from Backend and pasted Here
My Repo: https://github.com/CryptoBaba1/SmartContract-Frontend

My LotteryEntrance.js

import { abi, contractAddresses } from "../constants/index"
import { useMoralis, useWeb3Contract } from "react-moralis"
import { useEffect, useState } from "react"

export default function LotteryEntrance() {
    const { chainId: chainIdHex, isWeb3Enabled } = useMoralis()
    const chainId = parseInt(chainIdHex)
    console.log(chainId)
    const raffleAddress = chainId in contractAddresses ? contractAddresses[chainId][0] : null
    let { entranceFee, setEntranceFee } = useState("0")

    const { runContractFunction: getEntranceFee } = useWeb3Contract({
        abi: abi,
        contractAddress: raffleAddress, // specify the networkId
        functionName: "getEntranceFee",
        params: {},
    })

    useEffect(() => {
        if (isWeb3Enabled) {
            //try to read the Raffle Entrance Feee...

            async function UpdateUI() {
                const entranceFeeFromCall = await getEntranceFee()
                setEntranceFee(entranceFeeFromCall)
                console.log(entranceFee)
            }
            UpdateUI()
        }
    }, [isWeb3Enabled])
    return (
        <div>
            <h2>
                HI From LotteryEntrance!<div>{entranceFee}</div>
            </h2>
        </div>
    )
}

[technophile-04]

Hii, useState returns an array...., For first error please check you are passing right contractAddress, abi, and functionName

import { abi, contractAddresses } from "../constants/index"
import { useMoralis, useWeb3Contract } from "react-moralis"
import { useEffect, useState } from "react"

export default function LotteryEntrance() {
    const { chainId: chainIdHex, isWeb3Enabled } = useMoralis()
    const chainId = parseInt(chainIdHex)
    console.log(chainId)
    const raffleAddress = chainId in contractAddresses ? contractAddresses[chainId][0] : null
-    let { entranceFee, setEntranceFee } = useState("0")
+   const [entranceFee, setEntranceFee ] = useState("0");
 
+   // Make sure you give it correct abi and correct function name
    const { runContractFunction: getEntranceFee } = useWeb3Contract({
        abi: abi,
        contractAddress: raffleAddress, // specify the networkId
        functionName: "getEntranceFee",
        params: {},
    })

    useEffect(() => {
        if (isWeb3Enabled) {
            //try to read the Raffle Entrance Feee...

            async function UpdateUI() {
                const entranceFeeFromCall = await getEntranceFee()
                setEntranceFee(entranceFeeFromCall)
                console.log(entranceFee)
            }
            UpdateUI()
        }
    }, [isWeb3Enabled])
    return (
        <div>
            <h2>
                HI From LotteryEntrance!<div>{entranceFee}</div>
            </h2>
        </div>
    )
}

[Sunil-Reddy-Gummalla]

Hi @technophile-04 Thank you
For the First Issue 1. I was connected to Rinkeby in metamask and expecting it to Work.. So I changed to Hardhat Local and its Starts working
2. You are Correct it returns array Changed it .. Working Fine Now Thank you Again