使用单独组件创建自定义引用输入时出错

如果您想创建子对象,那么需要执行以下操作。这是我的应用程序中的代码,但我相信您会看到模式。

const TaleGenreInput = ({style, text, ...props}) => {
  return (
    <div style={style.container} >
      <span style={style.span}>{text}:&nbsp;</span>
      <ReferenceInput {...props} reference="genres" >
        <GenreInputGroup {...props} style={style} elStyle={style.elStyle} optionText='name' />
      </ReferenceInput>
    </div>
  )
}

const GenreInputGroup = ({style, elStyle, optionText, ...rest}) => {
  return (
    <div>
      <SelectInput {...rest} style={style.dropdown} elStyle={style.dropDownElStyle} optionText='name' allowEmpty />
      <SelectInput {...rest} style={style.dropdown} elStyle={style.dropDownElStyle} optionText='name' allowEmpty />
    </div>
  )
}

{…rest}确保从父级传递的所有道具都进入SelectInput。您还可以通过控制台记录其值来查看其包含的所有内容。对调试有很大帮助。