Question

我想知道如何在完成更改钩子后呈现组件。

例如，我使用 useEffect 在以下组件中所做的事情。但是有一个缺点，当我想使用该组件时：

<块引用>

“HomeClienteOProveedor”不能用作 JSX 组件。它的回报 “void”类型不是有效的 JSX 元素。

const HomeClienteOProveedor = () => {

  const [cliente, setCliente] = useState(true)

  getItem("clientType").then(res => {
    
    if (res=="1"){
     
      setCliente(true)
    
    }else{
      setCliente(false)
    } 
  })
    

  useEffect(() => {

    if (cliente){
      return ( ()=>{
        <HomeCliente />
     });
    }else{
      return ( ()=>{
        <HomeProveedor />
     });
    }

}, [ cliente]);
    
  
}

为什么我可以使用这样的东西：

 setCliente((true) => {
    console.log("its true!"); 
    
   
  });

Answer 1

更惯用的方法是在效果中运行异步代码，然后根据有状态值调整渲染：

const HomeClienteOProveedor = () => {
  const [cliente, setCliente] = useState(true)

  useEffect(() => {
    getItem("clientType").then(res => {
      if (res == "1") {
        setCliente(true);
      } else {
        setCliente(false);
      } 
    })
  }, []);
     
  return cliente ? <HomeCliente /> : <HomeProveedor />
}

正确更改钩子后渲染组件

1 个答案: