Input:文本域添加可清空属性

examples/play/index.vue

@@ -1,6 +1,28 @@
 <template>
   <div style="margin: 20px;">
-    <el-input v-model="input" placeholder="请输入内容"></el-input>
+    <el-input v-model="input" placeholder="请输入内容"   :clearable="true"></el-input>
+    <el-select v-model="value" placeholder="请选择">
+      <el-option
+        v-for="item in options"
+        :key="item.value"
+        :label="item.label"
+        :value="item.value"
+        :selectedColor="selectedColor"
+      >
+
+      </el-option>
+    </el-select>
+    <el-progress :percentage="50" :textColor="textColor" :defineBackColor="defineBackColor"></el-progress>
+    <el-progress :percentage="50" type="circle" ></el-progress>
+    <el-progress :percentage="50" type="dashboard"></el-progress>
+    <el-input
+  type="textarea"
+  autosize
+  :clearable="true"
+  placeholder="请输入内容"
+  v-model="textarea1"
+  >
+</el-input>
   </div>
 </template>
 
@@ -8,8 +30,36 @@
   export default {
     data() {
       return {
-        input: 'Hello Element UI!'
+        input: 'Hello Element UI!',
+        value:"",
+        options:[{
+          value:"选项1",
+          label:"黄金糕"
+        },
+        {
+          value:"选项2",
+          label:"双皮奶"
+        },
+        {
+          value:"选项3",
+          label:"蚵仔煎"
+        },
+        {
+          value:"选项4",
+          label:"龙须面"
+        }
+      ],
+      selectedColor:"#36ac9c",
+      num:1,
+      defineBackColor:"#ddd",
+      textColor:"blue",
+      textarea1:""
       };
+    },
+    methods:{
+      handleChange(value){
+        console.log(value)
+      }
     }
   };
 </script>

packages/input/src/input.vue

@@ -15,7 +15,7 @@
     @mouseenter="hovering = true"
     @mouseleave="hovering = false"
   >
-    <template v-if="type !== 'textarea'">
+    <template>
       <!-- 前置元素 -->
       <div class="el-input-group__prepend" v-if="$slots.prepend">
         <slot name="prepend"></slot>
@@ -39,6 +39,26 @@
         @change="handleChange"
         :aria-label="label"
       >
+      <textarea
+      v-else
+      :tabindex="tabindex"
+      class="el-textarea__inner"
+      @compositionstart="handleCompositionStart"
+      @compositionupdate="handleCompositionUpdate"
+      @compositionend="handleCompositionEnd"
+      @input="handleInput"
+      ref="textarea"
+      v-bind="$attrs"
+      :disabled="inputDisabled"
+      :readonly="readonly"
+      :autocomplete="autoComplete || autocomplete"
+      :style="textareaStyle"
+      @focus="handleFocus"
+      @blur="handleBlur"
+      @change="handleChange"
+      :aria-label="label"
+    >
+    </textarea>
       <!-- 前置内容 -->
       <span class="el-input__prefix" v-if="$slots.prefix || prefixIcon">
         <slot name="prefix"></slot>
@@ -55,7 +75,7 @@
           <template v-if="!showClear || !showPwdVisible || !isWordLimitVisible">
             <slot name="suffix"></slot>
             <i class="el-input__icon"
-              v-if="suffixIcon"
+              v-if="suffixIcon"                                                                                                          
               :class="suffixIcon">
             </i>
           </template>
@@ -79,32 +99,13 @@
           :class="['el-input__validateIcon', validateIcon]">
         </i>
       </span>
+      <span v-if="isWordLimitVisible && type === 'textarea'" class="el-input__count">{{ textLength }}/{{ upperLimit }}</span>
       <!-- 后置元素 -->
       <div class="el-input-group__append" v-if="$slots.append">
         <slot name="append"></slot>
       </div>
     </template>
-    <textarea
-      v-else
-      :tabindex="tabindex"
-      class="el-textarea__inner"
-      @compositionstart="handleCompositionStart"
-      @compositionupdate="handleCompositionUpdate"
-      @compositionend="handleCompositionEnd"
-      @input="handleInput"
-      ref="textarea"
-      v-bind="$attrs"
-      :disabled="inputDisabled"
-      :readonly="readonly"
-      :autocomplete="autoComplete || autocomplete"
-      :style="textareaStyle"
-      @focus="handleFocus"
-      @blur="handleBlur"
-      @change="handleChange"
-      :aria-label="label"
-    >
-    </textarea>
-    <span v-if="isWordLimitVisible && type === 'textarea'" class="el-input__count">{{ textLength }}/{{ upperLimit }}</span>
+    
   </div>
 </template>
 <script>
@@ -210,7 +211,7 @@
         }[this.validateState];
       },
       textareaStyle() {
-        return merge({}, this.textareaCalcStyle, { resize: this.resize });
+        return merge({}, this.textareaCalcStyle, { resize: this.resize }, {paddingRight: 30 + 'px'});
       },
       inputSize() {
         return this.size || this._elFormItemSize || (this.$ELEMENT || {}).size;