Select: fix readonly problem in edge (#13034)

Cascader select readonly 添加 edge 浏览器判断; src/utils/util.js 添加 isIE, isEdge方法;
ElemeFE · Oct 17, 2018 · 868bbc7 · 868bbc7
1 parent ef39757
commit 868bbc7
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 7 deletions.
diff --git a/packages/cascader/src/main.vue b/packages/cascader/src/main.vue
@@ -71,7 +71,7 @@ import emitter from 'element-ui/src/mixins/emitter';
 import Locale from 'element-ui/src/mixins/locale';
 import { t } from 'element-ui/src/locale';
 import debounce from 'throttle-debounce/debounce';
-import { generateId, escapeRegexpString } from 'element-ui/src/utils/util';
+import { generateId, escapeRegexpString, isIE, isEdge } from 'element-ui/src/utils/util';
 
 const popperMixin = {
   props: {
@@ -223,8 +223,7 @@ export default {
       return this.disabled || (this.elForm || {}).disabled;
     },
     readonly() {
-      const isIE = !this.$isServer && !isNaN(Number(document.documentMode));
-      return !this.filterable || (!isIE && !this.menuVisible);
+      return !this.filterable || (!isIE() && !isEdge() && !this.menuVisible);
     }
   },
 

diff --git a/packages/select/src/select.vue b/packages/select/src/select.vue
@@ -147,7 +147,7 @@
   import { t } from 'element-ui/src/locale';
   import scrollIntoView from 'element-ui/src/utils/scroll-into-view';
   import { getValueByPath } from 'element-ui/src/utils/util';
-  import { valueEquals } from 'element-ui/src/utils/util';
+  import { valueEquals, isIE, isEdge } from 'element-ui/src/utils/util';
   import NavigationMixin from './navigation-mixin';
   import { isKorean } from 'element-ui/src/utils/shared';
 
@@ -180,9 +180,7 @@
       },
 
       readonly() {
-        // trade-off for IE input readonly problem: https://github.com/ElemeFE/element/issues/10403
-        const isIE = !this.$isServer && !isNaN(Number(document.documentMode));
-        return !this.filterable || this.multiple || !isIE && !this.visible;
+        return !this.filterable || this.multiple || (!isIE() && !isEdge() && !this.visible);
       },
 
       showClose() {

diff --git a/src/utils/util.js b/src/utils/util.js
@@ -1,3 +1,5 @@
+import Vue from 'vue';
+
 const hasOwnProperty = Object.prototype.hasOwnProperty;
 
 export function noop() {};
@@ -110,3 +112,11 @@ export const coerceTruthyValueToArray = function(val) {
     return [];
   }
 };
+
+export const isIE = function() {
+  return !Vue.prototype.$isServer && !isNaN(Number(document.documentMode));
+};
+
+export const isEdge = function() {
+  return !Vue.prototype.$isServer && navigator.userAgent.indexOf('Edge') > -1;
+};