reactjs - 道具在返回中未定义但另有定义

Question

我正在尝试将一些道具从父组件传递给子组件，但我很困惑。当我尝试在返回之前打印道具时，我得到了值，但是如果我尝试在 jsx 中使用它们，我得到未定义。

const FormField = (empty, stateName, value, smallLetters, changeValue) => {
   console.log(empty, stateName, value, smallLetters, changeValue);
  return(
    <div>
      {console.log(empty, stateName, value, smallLetters, changeValue)}
  <label htmlFor="formGroupExampleInput">{value}</label>
   <input type="text" className='form-control' required onChange={(e) => { changeValue(e, stateName); }}/>
  </div>
);
}

打印语句的结果：

标签： reactjsjsx

Answer 1

一个反应函数组件期望props作为一个对象，而不是作为单独的参数。

尝试

const FormField = ({empty, stateName, value, smallLetters, changeValue}) ....