时间戳

首页 > 解决方案 > 子组件 props 是空的，尽管它们是从父组件传递的

javascript - 子组件 props 是空的，尽管它们是从父组件传递的

问题描述

我尝试获取openMenu从父函数到子函数的值，但子函数中的props.value值为空，我不明白为什么。

function Child({ routes }, props) {

  return (

    <div>{props.value}</div>        /*This is empty*/
  )
}

function Parent() {
  const [isOpen, setOpen] = useState({
    isOpen: false
  });

  const handleClick = e => {
    e.preventDefault();
    setOpen(isOpen => !isOpen);

    if(isOpen === true) {
      const openMenu = 'open';
      return <Child value={openMenu}/>;      
    } 
    else {
      const openMenu = 'close';
      return <Child value={openMenu} />     
    }      

  };
}

我想获取openMenuChild 组件的打开或关闭的值。

标签： javascriptreactjsreact-props

解决方案

Props 是函数组件中的第一个参数。

function Child(props) {
  return (   
    <div>{props.value}</div>    
  )
}

如果您正在尝试解构routes，props您可以使用其余模式 ( ...) 来获取所有其他道具。

function Child({ routes, ...props }) {
  return (   
    <div>{props.value}</div>    
  )
}

推荐阅读