简体   繁体   English

next.js 代码在运行开发中工作,但不运行构建

[英]next.js code works in run dev but not run build

The problem is with the useAddress() funciton in run dev when console logged it returns undefined undefiuned then address however in the run build/start it just returns undefined.问题在于运行开发中的 useAddress() 功能,当控制台记录时它返回未定义的未定义然后地址,但是在运行构建/启动中它只返回未定义。 How do I go about fixing this.我该如何解决这个问题。

 import { useAddress } from "@thirdweb-dev/react"; import Head from 'next/head'; import Link from 'next/link'; import Username from '../components/Username'; import React from "react"; const Home = () => { let address = useAddress(); console.log(address) if (address) { return ( <> <Head> <title>home</title> <link rel="icon" href="/drum.svg" /> </Head> <Username address={address} /> </> ); } else { return ( <> <Head> <title>home</title> <link rel="icon" href="/drum.svg" /> </Head> <Link href="/"> <a className="absolute pt-1 text-xl font-semibold transform -translate-x-1/2 top-1/2 left-1/2">click here to log in</a> </Link> </> ); } } export default Home;

Imperative code is too unpredictible in React. React 中的命令式代码太不可预测了。 You should use useEffect(()=>{console.log(address)},[]) instead and it will probably work the same in both settings.您应该改用useEffect(()=>{console.log(address)},[]) ,它在两种设置中的工作方式可能相同。

I hope this works:我希望这有效:

import { useAddress } from "@thirdweb-dev/react";
import Head from 'next/head';
import Link from 'next/link';
import Username from '../components/Username';
import React, {useState, useEffect} from "react";

const Home = () => {
    const [address, setAddress] = useState(false)

    useEffect(()=> {
        setAddress(useAddress())
    }, [])

   
    
        if (address) {
            return (
                <>
                    <Head>
                        <title>home</title>
                        <link rel="icon" href="/drum.svg" />
                    </Head>
                    <Username address={address} />
                </>
            );
        } else {
            return (
                <>
                    <Head>
                        <title>home</title>
                        <link rel="icon" href="/drum.svg" />                
                    </Head>
                    <Link href="/">
                    <a className="absolute pt-1 text-xl font-semibold transform -translate-x-1/2 top-1/2 left-1/2">click here to log in</a>
                    </Link>
                </>
            );
        }
}

export default Home;

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM