首页 > 解决方案 > 我正在尝试在 IonSelect multiple 中添加值,但它在反应离子中仅选择一个值

问题描述

我已经添加了下拉字段,我必须在我发送的下拉列表中显示值,但在这个 ionselect 中,它只需要一个下拉值。

const intila={
    primary:[""]

  }
  const[primarySkill,setPrimary]=useState(intila);
  const handleChange=(event:any)=>{
    primarySkill.primary=event.target.value;
    setPrimary(primarySkill);}
const[isSuccess,setSuccess]=useState(false);
   const handleSubmit=(event:any)=>{
     dispatch(postPrimary())
   }
   if(customerData.primary.length>0&&!customerData.isLoading&&!isSuccess){
     for(var i=0;i<customerData.primary.length;i++){
      var primary=customerData.primary[i];     
       primarySkill.primary.push(primary);
      setPrimary(primarySkill); }
     setSuccess(true);
     console.log(primarySkill);
   }
  return (
    <div>
      <IonSelect  className="ion-padding" multiple={true} onIonChange={handleChange} value={primarySkill.primary}>
      {itemCustomers}
      </IonSelect>
      <IonButton onClick={handleSubmit}/>
    </div>)

postPrimary 有 ["Customer 1","Customer 2"]

itemCustomer 有 [Customer 1,Customer 2,Customer 3,Customer 4,Customer 5[][1]

这里是 UI 的图像视图:[1]:https ://i.stack.imgur.com/RdmYz.png

标签: ionic-frameworkreduxreact-tsx

解决方案


  const handleChange=(event:any)=>{
    primarySkill.primary = event.detail.value;
    setPrimary(primarySkill);
  }

为我工作


推荐阅读