微信公众号select 用vue绑定change事件 在安卓手机上闪屏 无法加载select下拉选?
发布于 7 年前 作者 li50 8249 次浏览 来自 问答

正常页面如下 点击选择省加载省下拉选项

现有部分安卓手机出现点击选择省无法加载select下拉选项并伴随屏幕页面闪烁的现象

代码如下

<div class="input-group">
                        <select name="" id="" class="flex-full input select"
                            v-on:change="provinceSelect($event)">
                            <option value="">选择省</option>
                            <option v-for="(province,index) in provincelist"
                                v-bind:value="index">{{province.areaname}}</option>
                        </select> <select name="" id="" class="flex-full input select"
                            v-on:change="citySelect($event)">
                            <option value="">选择市</option>
                            <option v-for="(city,index) in citylist" v-bind:value="index">{{city.areaname}}</option>
                        </select> <select name="" id="" class="flex-full input select"
                            style="margin-right: 0;" v-on:change="countySelect($event)">
                            <option value="">区县</option>
                            <option v-for="(county,index) in countylist" v-bind:value="index">{{county.areaname}}</option>
                        </select>
                    </div>
 var vm = new Vue({
            el: '#app',
            data: {
                isLoding: false,
                showModal: false, // 是否弹窗生成海报
                showActive: 0, // 弹窗下标(0:分享,1:评价,2:评价成功 3:积分记录,4:邀请好友记录)
                state: 0, // 状态(0:绑定信息,1:未服务,2:服务中,3:服务完成,4:已评价)
               
                shareId: '', //生成海报的右上角编号
                base64: [], //生成的海报图片
                pingjia: ['上门及时', '主动沟通', '服务态度好', '服务热情', '细致贴心', '技术专业'], //服务评价
                pingjiasel: [false, false, false, false, false, false], //服务评价选择
                page: 1, //当前页
                size: 16, //每页多少
                jifenData: [], //积分记录
                yaoqData: [], //邀请好友记录
                
                timer:null,
                count:0,
                TIME_COUNT:300,
                codeImgSrc:"",
                userId:null,
                serviceNamePhone:"",
                timer_user:null,
            //获取到的验证码
                ajaxCode:"",
                serviceFinishUser:{
                    name:"",
                    mobile:"",
                    address:"",
                },
                shareImg: '<%=basePath%>/view/mall/img/[email protected]', //生成海报的背景图(6选1)
                codeImg: '', //生成海报的二维码图片,
                provincelist:[],
                citylist:[],
                countylist:[],
                activityAreaProvinceId:null,
                activityAreaProvince:null,
                activityAreaCityId:null,
                activityAreaCity:null,
                activityAreaCountyId:null,
                activityAreaCounty:null,
                myjf:"我的积分:0",
                ifServiceState:true,
                shareUserlist:[],
                //openid:'${openid}',
                serviceEndNotifyFlag:false,
                openid:'ocKV5jhBNFWPqpG-93uKaMs9U320-93uKaMs9U320',
                diasabledInput:false,
                diasabledImg:true,
            },
 methods: {
  getAreaProvince: function (){
                      var _this=this;
                      $.ajax({
                              type: "POST",
                              url: "<%=basePath%>/smileActivity/getArea.do",
                              data: {
                                     'arealevel':1
                              },
                              success: function (result) {
                                  var res=JSON.parse(result);
                                  //console.log("ajax获取区域--"+JSON.stringify(res));
                                  _this.provincelist=res.arealist;
                                 
                              },
                          });
                  },
                  
                  provinceSelect:function(event){
                      var _this=this;
                      var index=event.target.value;
                      this.activityAreaProvinceId = this.provincelist[index].areaid;
                      this.activityAreaProvince = this.provincelist[index].areaname;
                      console.log(this.activityAreaProvince);
                      console.log(this.activityAreaProvinceId);
                      $.ajax({
                              type: "POST",
                              url: "<%=basePath%>/smileActivity/getArea.do",
                              data: {
                                     'arealevel':2,
                                    areaparentid:this.activityAreaProvinceId
                              },
                              success: function (result) {
                                  var res=JSON.parse(result);
                                 // console.log("ajax获取区域--"+JSON.stringify(res));
                                  _this.citylist=res.arealist;
                                 
                              },
                          });
                  },
                  
                  citySelect:function(event){
                      var _this=this;
                      var index=event.target.value;
                      this.activityAreaCityId = this.citylist[index].areaid;
                      this.activityAreaCity = this.citylist[index].areaname;
                      console.log(this.activityAreaCity);
                      console.log(this.activityAreaCityId);
                      $.ajax({
                              type: "POST",
                              url: "<%=basePath%>/smileActivity/getArea.do",
                              data: {
                                     'arealevel':3,
                                    areaparentid:this.activityAreaCityId
                              },
                              success: function (result) {
                                  var res=JSON.parse(result);
                                  //console.log("ajax获取区域--"+JSON.stringify(res));
                                  _this.countylist=res.arealist;
                                 
                              },
                          });
                  },
                  countySelect:function(event){
                      var _this=this;
                      var index=event.target.value;
                      this.activityAreaCountyId = this.countylist[index].areaid;
                      this.activityAreaCounty = this.countylist[index].areaname;
                      
                      console.log(this.activityAreaCounty);
                      console.log(this.activityAreaCountyId);
                      
                  }
}

 created: function() {
                    this.getAreaProvince();
}
1 回复

你好,请提供出现问题的具体机型、微信版本号、可复现问题的测试链接

回到顶部