У меня есть форма ниже, которая работает почти. Я могу дать «Console.log» на всех печатных полях, но я не могу дать Console.log в выбранном варианте «Выбрать». Как мне это решить? Благодарю.

//Rest of code omitted

const initialValue = {
  tenants: '',
  options: ''
 
}

 //Rest of code omitted

function onChange(evt) {
    const { name, value } = evt.target
    setValues({ ...values, [name]: value });     
    console.log({ name, value }) //<-- this console.log is NOT returning anything.
  }



 <Select
   options={contractsOptions}
   onChange={obj => dispatch(selectContract(obj && obj.value ? obj.value : ''))}
   name="tenants"
   id="tenants"
   className="select-group"
   isSearchable={true}
   placeholder={<div>Tenants</div>}
   isClearable={true}
   theme={headerSelectTheme}


 />
0
claudiopb 7 Июн 2021 в 09:57

3 ответа

Лучший ответ

Во-первых, вы не звоните функции onChange. Во-вторых, если вы хотите только console.log при изменении select tag, вы всегда можете сделать это.

<Select
   options={contractsOptions}
   onChange={obj => {dispatch(selectContract(obj && obj.value ? obj.value : ''))};
   console.log("obj",obj);}
   name="tenants"
   id="tenants"
   className="select-group"
   isSearchable={true}
   placeholder={<div>Tenants</div>}
   isClearable={true}
   theme={headerSelectTheme}
 />
1
M.Hassan Nasir 7 Июн 2021 в 07:15

Вы не используете функцию изменения ...

   <Select
   options={contractsOptions}
   onChange={()=>onChange()}
   name="tenants"
   id="tenants"
   className="select-group"
   isSearchable={true}
   placeholder={<div>Tenants</div>}
   isClearable={true}
   theme={headerSelectTheme}


 />
1
Daniel 7 Июн 2021 в 07:02

Похоже, ваш функция {onChange не связана с компонентом <Select />.

Вы пробовали что-то вроде

//Rest of code omitted

const initialValue = {
  tenants: '',
  options: ''
 
}

 //Rest of code omitted

function onChange(evt) {
    console.log(evt);   // I'm adding this before the other ones because I'm not sure what your Select component is returning for onChange event.
    const { name, value } = evt.target
    setValues({ ...values, [name]: value });   
    console.log({ name, value }) //<-- this console.log is NOT returning anything.
  }



 <Select
   options={contractsOptions}
   onChange={onChange} // here goes the change handling function
   name="tenants"
   id="tenants"
   className="select-group"
   isSearchable={true}
   placeholder={<div>Tenants</div>}
   isClearable={true}
   theme={headerSelectTheme}
 />

0
Gabriel Vilches Alves 7 Июн 2021 в 07:03