Merge pull request #2263 from Kingwl/input-resize

Input: support resize prop

examples/docs/en-US/input.md

@@ -565,6 +565,7 @@ Search data from server-side.
 |name | same as `name` in native input | string | — | — |
 |max | same as `max` in native input | * | — | — |
 |min | same as `min` in native input | * | — | — |
+|resize| control the resizability | string | none, both, horizontal, vertical | — |
 |autofocus | same as `autofocus` in native input | boolean | — | false |
 |form | same as `form` in native input | string | — | — |
 

examples/docs/zh-CN/input.md

@@ -728,6 +728,7 @@ export default {
 | name | 原生属性 | string | — | — |
 | max | 原生属性，设置最大值 | * | — | — |
 | min | 原生属性，设置最小值 | * | — | — |
+| resize | 控制是否能被用户缩放 | string | none, both, horizontal, vertical | — |
 | autofocus | 原生属性，自动获取焦点 | boolean | true, false | false |
 | form | 原生属性 | string | — | — |
 

packages/input/src/calcTextareaHeight.js

+import merge from 'element-ui/src/utils/merge';
+
 let hiddenTextarea;
 
 const HIDDEN_STYLE = `
@@ -53,7 +55,8 @@ function calculateNodeStyling(node) {
 export default function calcTextareaHeight(
   targetNode,
   minRows = null,
-  maxRows = null
+  maxRows = null,
+  options = null
 ) {
   if (!hiddenTextarea) {
     hiddenTextarea = document.createElement('textarea');
@@ -96,5 +99,5 @@ export default function calcTextareaHeight(
     height = Math.min(maxHeight, height);
   }
 
-  return { height: height + 'px'};
+  return merge({ height: height + 'px'}, options);
 };

packages/input/src/input.vue

@@ -88,6 +88,7 @@
       value: [String, Number],
       placeholder: String,
       size: String,
+      resize: String,
       readonly: Boolean,
       autofocus: Boolean,
       icon: String,
@@ -149,7 +150,10 @@
         const minRows = autosize.minRows;
         const maxRows = autosize.maxRows;
 
-        this.textareaStyle = calcTextareaHeight(this.$refs.textarea, minRows, maxRows);
+        const options = {
+          resize: this.resize
+        };
+        this.textareaStyle = calcTextareaHeight(this.$refs.textarea, minRows, maxRows, options);
       },
       handleFocus(event) {
         this.$emit('focus', event);