Reactjs 如何使用react语义ui将选定值设置为状态

Reactjs 如何使用react语义ui将选定值设置为状态,reactjs,react-select,semantic-ui-react,Reactjs,React Select,Semantic Ui React,我试图将选择的值设置为反应状态,但最终未定义。我有两个输入元素,title输入工作得很好,但我无法找出semantic ui的select元素缺少了什么 以下是我的组件代码: const options = [ { key: 'a', text: 'All', value: 'ALL' }, { key: 'b', text: 'Branch', value: 'BRANCH' }, ] export function AddCategory({ eId }) { const [t

我试图将选择的值设置为反应状态,但最终未定义。我有两个输入元素,title输入工作得很好,但我无法找出semantic ui的select元素缺少了什么

以下是我的组件代码:

const options = [
  { key: 'a', text: 'All', value: 'ALL' },
  { key: 'b', text: 'Branch', value: 'BRANCH' },
]

export function AddCategory({ eId }) {
  const [title, setTitle] = useState('')
  const [eligible, setEligible] = useState('')

  return <Mutation mutation={ADD_CATEGORY}
                   refetchQueries={[{ query: CATEGORIES_QUERY, variables: { eId } }]}>
    {(mutate, { loading, data, error }) => {
      if (error) return <ErrorMessage message={error.message}/>
      if (data) setTitle('')

      return <Form
        loading={loading}
        onSubmit={(e) => {
          e.preventDefault()
          console.log('eligible', eligible) //undefined here

          mutate({
            variables: {
              input: {
                title,
                eligible,
                eId,
              },
            },
          })
        }}>
        <Form.Group>
          <Form.Input
            name="title"
            placeholder='Title'
            onChange={e => setTitle(e.target.value)}
          />
          <Form.Field
            name="eligible"
            control={Select}
            options={options}
            placeholder='Select Eligibility'
            onChange={e => {
              console.log('target', e.target.value) //undefined here
              setEligible(e.target.value)
            }}
          />
          <Form.Button content='Add'/>
        </Form.Group>
      </Form>
    }}
  </Mutation>
}
const选项=[
{键:'a',文本:'All',值:'All'},
{键:'b',文本:'Branch',值:'Branch'},
]
导出函数AddCategory({eId}){
const[title,setTitle]=useState(“”)
const[qualified,setqualified]=useState(“”)
返回
{(mutate,{加载,数据,错误})=>{
如果(错误)返回
如果(数据)设置标题(“”)
返回{
e、 预防默认值()
console.log('qualified',qualified)//此处未定义
变异({
变量:{
输入:{
标题
合格的,
开斋节,
},
},
})
}}>
setTitle(e.target.value)}
/>
{
console.log('target',e.target.value)//此处未定义
SetQualified(如目标值)
}}
/>
}}
}
我建议试试

。。。
const onSelectChange=(evt,数据)=>{
console.log(data.value);
}
...
onChange={onSelectChange},
...

我知道在基于类的组件中使用这种方法,但不知道在基于函数的状态挂钩中使用这种方法,但我会尝试一下。