reactjs - 使用wagmi和next.js，如何在getServerSideProps中调用useContractReads？

Question

我正在尝试使用 getServerSideProps 中的 useContractReads 获取一些链上数据

import React from "react"

import {
    useContractReads,
} from 'wagmi'

import { ProjectContractAddress, ProjectContractAbi } from '../constants'

export async function getServerSideProps() {
    const contract = {
        addressOrName: ProjectContractAddress,
        contractInterface: ProjectContractAbi,
        functionName: 'proposalCount'
    }
    const { data, isError, isLoading, isSuccess } = useContractReads({
        contracts: [
            contract,
        ],
    })
    result = data?.toString() ?? undefined
    return {
        props: { result }, // will be passed to the page component as props
    }
}


export default function AllProjects({ result }) {
(...)

浏览器告诉我“TypeError:无法读取 null 的属性(读取“useRef”)” 当服务器控制台告诉我“警告:无效的钩子(Hook)调用。钩子(Hook)只能在函数组件的主体内部调用。这可能是由于以下原因之一而发生的:(...)”

我做错了什么？

Answer 1

正如 juliomalves 提到的，您不能在 getServerSideProps 中使用钩子(Hook)。但是您可以使用 readContract在wagmi-core中，无需使用钩子(Hook)即可获取链上数据。