소스 검색

minor fixes for select, message-box and textarea

Leopoldthecoder 7 년 전
부모
커밋
2999279ae3
5개의 변경된 파일46개의 추가작업 그리고 9개의 파일을 삭제
  1. 5 2
      packages/input/src/calcTextareaHeight.js
  2. 7 1
      packages/input/src/input.vue
  3. 22 2
      packages/message-box/src/main.vue
  4. 6 0
      packages/select/src/select.vue
  5. 6 4
      yarn.lock

+ 5 - 2
packages/input/src/calcTextareaHeight.js

@@ -52,7 +52,7 @@ function calculateNodeStyling(targetElement) {
 
 export default function calcTextareaHeight(
   targetElement,
-  minRows = null,
+  minRows = 1,
   maxRows = null
 ) {
   if (!hiddenTextarea) {
@@ -71,6 +71,7 @@ export default function calcTextareaHeight(
   hiddenTextarea.value = targetElement.value || targetElement.placeholder || '';
 
   let height = hiddenTextarea.scrollHeight;
+  const result = {};
 
   if (boxSizing === 'border-box') {
     height = height + borderSize;
@@ -87,6 +88,7 @@ export default function calcTextareaHeight(
       minHeight = minHeight + paddingSize + borderSize;
     }
     height = Math.max(minHeight, height);
+    result.minHeight = `${ minHeight }px`;
   }
   if (maxRows !== null) {
     let maxHeight = singleRowHeight * maxRows;
@@ -95,6 +97,7 @@ export default function calcTextareaHeight(
     }
     height = Math.min(maxHeight, height);
   }
+  result.height = `${ height }px`;
 
-  return { height: height + 'px'};
+  return result;
 };

+ 7 - 1
packages/input/src/input.vue

@@ -141,7 +141,13 @@
       resizeTextarea() {
         if (this.$isServer) return;
         var { autosize, type } = this;
-        if (!autosize || type !== 'textarea') return;
+        if (type !== 'textarea') return;
+        if (!autosize) {
+          this.textareaCalcStyle = {
+            minHeight: calcTextareaHeight(this.$refs.textarea).minHeight
+          };
+          return;
+        }
         const minRows = autosize.minRows;
         const maxRows = autosize.maxRows;
 

+ 22 - 2
packages/message-box/src/main.vue

@@ -15,7 +15,14 @@
             <slot><p>{{ message }}</p></slot>
           </div>
           <div class="el-message-box__input" v-show="showInput">
-            <el-input v-model="inputValue" @keyup.enter.native="handleAction('confirm')" :placeholder="inputPlaceholder" ref="input"></el-input>
+            <el-input
+              v-model="inputValue"
+              @compositionstart.native="handleComposition"
+              @compositionupdate.native="handleComposition"
+              @compositionend.native="handleComposition"
+              @keyup.enter.native="handleKeyup"
+              :placeholder="inputPlaceholder"
+              ref="input"></el-input>
             <div class="el-message-box__errormsg" :style="{ visibility: !!editorErrorMessage ? 'visible' : 'hidden' }">{{ editorErrorMessage }}</div>
           </div>
         </div>
@@ -97,6 +104,18 @@
     },
 
     methods: {
+      handleComposition(event) {
+        if (event.type === 'compositionend') {
+          setTimeout(() => {
+            this.isOnComposition = false;
+          }, 100);
+        } else {
+          this.isOnComposition = true;
+        }
+      },
+      handleKeyup() {
+        !this.isOnComposition && this.handleAction('confirm');
+      },
       getSafeClose() {
         const currentId = this.uid;
         return () => {
@@ -234,7 +253,8 @@
         confirmButtonDisabled: false,
         cancelButtonClass: '',
         editorErrorMessage: null,
-        callback: null
+        callback: null,
+        isOnComposition: false
       };
     }
   };

+ 6 - 0
packages/select/src/select.vue

@@ -226,6 +226,12 @@
     },
 
     watch: {
+      disabled() {
+        this.$nextTick(() => {
+          this.resetInputHeight();
+        });
+      },
+
       placeholder(val) {
         this.cachedPlaceHolder = this.currentPlaceholder = val;
       },

+ 6 - 4
yarn.lock

@@ -239,9 +239,11 @@ async-each@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.1.tgz#19d386a1d9edc6e7c1c85d388aedbcc56d33602d"
 
-async-validator@1.6.9:
-  version "1.6.9"
-  resolved "https://registry.yarnpkg.com/async-validator/-/async-validator-1.6.9.tgz#a8309daa8b83421cdbd4628e026d6abb25192d34"
+async-validator@~1.8.1:
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/async-validator/-/async-validator-1.8.1.tgz#6665788ca39269af770e5ee02f0e557f2438d2ca"
+  dependencies:
+    babel-runtime "6.x"
 
 async@1.5.2, async@1.x, async@^1.3.0, async@^1.4.0, async@^1.5.0:
   version "1.5.2"
@@ -696,7 +698,7 @@ babel-register@^6.18.0:
     mkdirp "^0.5.1"
     source-map-support "^0.4.2"
 
-babel-runtime@^6.0.0, babel-runtime@^6.11.6, babel-runtime@^6.18.0, babel-runtime@^6.20.0, babel-runtime@^6.9.0:
+babel-runtime@6.x, babel-runtime@^6.0.0, babel-runtime@^6.11.6, babel-runtime@^6.18.0, babel-runtime@^6.20.0, babel-runtime@^6.9.0:
   version "6.20.0"
   resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.20.0.tgz#87300bdcf4cd770f09bf0048c64204e17806d16f"
   dependencies: