javascript - 如何在 reactjs 的 Formik 多选字段中将新值更新为选定值？

Question

我想更新 formik 多选字段。当我向 API 和之后添加新值时，新值设置为 formik 多选字段中的选定值

const [toppings, setToppings] = useState([]);
useEffect(() => {
 if (mainStore.topping) {
            mainStore.getToppings()
                .then(([success, data]) => {
                    if (success) {
                        setToppings(data.toppings)
                    } else {
                        setErrorMsg(data)
                    }
                })
        }
},[])


{formik =>

    <div className='p-col-12 p-md-6'>
       <div className='p-grid form-control-group'>
          <div className='p-col-12'>                                                                
              <label>Toppings</label>                                                            
          </div>
       <div className='p-col-12'>                                                                
         <div className="p-inputgroup">                                                                    
           <Field name='product_toppings' as={MultiSelect} optionLabel='name' optionValue='topping_id' options={toppings} filter={true} /> 
    
          <Button icon="pi pi-plus" type='button' className="p-button-success" onClick={() => { mainStore.visible = true; mainStore.topping = true; mainStore.stopLoading = true }} />
    
             </div>
          </div>
          <div className='p-col-12'>
                <ErrorMessage name='product_toppings' component={FormErrorMsg} />
         </div>
       </div>
     </div>}

标签： javascriptreactjsangularjsmulti-selectformik