uniapp ios 键盘弹出 禁止页面滚动

(check.png)

(checkbox.png)

(checkDisable.png)

以上三张图是我的可选择状态，已选中，以及不可选择等三种；接下来来写几种使用情景；具体样式我不再细写了，只说逻辑，需要说明image需要放在你所选择的循环里，比如如下，仅做展示，样式可以根据需要写

1：只支持单选，并且都可以选择

<image v-if="orderarr.length!=0" @click="toCheck(item.id)" class="check" :src="orderarr.includes(item.id)?'/static/img/check.png':'/static/img/checkbox.png'"></image>     这里是表示，已选中是选中状态，未选中则是可选择状态
 <image v-else @click="toCheck(item.id)" class="check" src="/static/img/checkbox.png"></image>      这里是表示当前需要选择的内容全部可选

其中的orderarr是你所选中的id数组，includes方法是判断当前数组是否包含当前循环的id

check方法

toCheck(id){
                if(this.orderarr.length==0){//判断当前id数组是否为空，若是为空，则直接push
                  this.orderarr.push(id)
                }else{
　　　　　　　　　　　　this.orderarr=[]//由于当前逻辑是单选，直接清空再push就好了
　　　　　　　　　　　　this.orderarr.push(id) 
　　　　　　　　　　} 
　　　　　　　　　　console.log(this.orderarr); },

2：支持多选，并且所有选项均可选择

toCheck(id){
                if(this.orderarr.length==0){//判断当前id数组是否为空，若是为空，则直接push
                  this.orderarr.push(id)
                }else{
                    if(this.orderarr.includes(id)){//判断当前点击的选项是否已经被选择了
                        this.orderarr.forEach((val,index) => {
                            if(val==id){//若被选择，则清除调当前选项
                            　　this.orderarr.splice(index,1); 
                            }
                        });
                    } else{
                        this.orderarr.push(id)//若没有被选择，则直接push
                    }
                }
            console.log(this.orderarr);
        },

3：支持多选，并且，当某选项只可单选时，其他选项禁止点击；

<view v-show="isSuperpose"> 当前为已选中状态，其中其他选项不可点击
         <image v-if="couponArr.length!=0" @click="toCheck(c)" class="check" :src="couponArr.includes(c.id)?'/static/img/check.png':'/static/img/checkDisable.png'"></image>
         <image v-else @click="toCheck(c)"  class="check" src="/static/img/checkbox.png"></image>
</view>
<view v-show="!isSuperpose">  当前为已选中状态，其中其他选项可以点击选择
         <image v-if="couponArr.length!=0" @click="toCheck(c)" class="check" :src="couponArr.includes(c.id)?'/static/img/check.png':'/static/img/checkbox.png'"></image>
         <image v-else @click="toCheck(c)" class="check" src="/static/img/checkbox.png"></image>
</view>

　　toCheck方法

toCheck(item){
                console.log(item.superpose);
                if(this.isSuperpose){//如果当前除已选中状态外，其他选项不可点击
                    if(this.couponArr.includes(item.id)){//判断当前点击的是否已经被选择，若当前选项已被选择，则当前点击操作是取消选中，并可以选择其他选项
                        this.couponArr.forEach((val,index) => {
                            if(val==item.id){
                                this.couponArr.splice(index,1); 
                            }
                        });
                        this.isSuperpose=false
                    } else{
　　　　　　　　　　　　　　//因为其与选项不可点击，所以不作操作
                    }
                }else{
                    if(item.superpose==1){//我们是在接口中返回是当前选择项是否可多选，当值为1时，不可多选
                        if(this.couponArr.length==0){
                            this.couponArr.push(item.id)//未选中时，直接push
                        }else{
                        　　console.log(this.couponArr);//若有已选中选项，但由于当前项只可单选，则直接清空couponArr,在push
                        　　this.couponArr=[]
                           this.couponArr.push(item.id)
                        }         
                        this.isSuperpose=true//并将状态修改成其他选项不可选择
                    }else{//若当前选择项可以多选
                        if(this.couponArr.length==0){
                            this.couponArr.push(item.id)//未选中时，直接push
                        }else{剩下多选的逻辑则同上
                            if(this.couponArr.includes(item.id)){
                                this.couponArr.forEach((val,index) => {
                                    if(val==item.id){;
                                        this.couponArr.splice(index,1); 
                                    }
                                });
                            } else{
                                this.couponArr.push(item.id)
                            }
                        }     
                        this.isSuperpose=false
                }

                }
        },