真正解决！！el-select组件在IOS移动端点击两次才能选中的问题

最新推荐文章于 2024-09-03 10:26:56 发布

edisonwong520

最新推荐文章于 2024-09-03 10:26:56 发布

阅读量823

点赞数 7

文章标签： ios html5 elementui

本文链接：https://blog.csdn.net/Doggie060711/article/details/135052950

版权

很恶心，网上都是千遍一律的copy，说改opacity的，都不行！
我去官网看了issue，作者说，element 本来就不是为了移动端了，所以你去找vant吧。。。（无语尬住）
然后我看有说FastClick的，反正我是不行。我自己摸索了一个方式，就是判断是不是ios 移动端，是就监听touchstart，第一次就展示下拉。直接上代码。

如果能帮到你解决问题，辛苦去 github 随便挑个我的项目点个star，谢谢🙏 https://github.com/edisonwong520

<el-select
          ref="moodSelect"
          @touchstart="recordTouchStart(this.$refs.moodSelect)"
          style="width: 100%"
          clearable

函数部分

recordTouchStart(r) {
      const u = navigator.userAgent;
      const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
      if (isiOS && this._isMobile()) {
        console.log("ios");
        r.visible = true; //only work in iOS
      }
    },
    _isMobile() {
      return navigator.userAgent.match(
        /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
      );
    },