Parcourir la source

InputNumber: add `select` method (#13286)

* Input: add test for `select` method

* InputNumber: add `select` method
st-sloth il y a 6 ans
Parent
commit
9d09d0dbf4

+ 2 - 0
examples/docs/en-US/input-number.md

@@ -205,3 +205,5 @@ Use attribute `size` to set additional sizes with `medium`, `small` or `mini`.
 | Method | Description | Parameters |
 |------|--------|-------|
 | focus | focus the Input component | - |
+| select | select the text in input element | — |
+

+ 2 - 0
examples/docs/es/input-number.md

@@ -206,3 +206,5 @@ Utilice el atributo `size` para establecer tamaños adicionales con `medium`, `s
 | Método | Descripción                          | Parámetro |
 | ------ | ------------------------------------ | --------- |
 | focus  | coloca el foco en el elemento actual | -         |
+| select | selecciona el texto del input        | -          |
+

+ 1 - 0
examples/docs/zh-CN/input-number.md

@@ -202,3 +202,4 @@
 | 方法名 | 说明 | 参数 |
 | ---- | ---- | ---- |
 | focus | 使 input 获取焦点 | - |
+| select | 选中 input 中的文字 | — |

+ 3 - 0
packages/input-number/src/input-number.vue

@@ -233,6 +233,9 @@
         if (!isNaN(newVal) || value === '') {
           this.setCurrentValue(newVal);
         }
+      },
+      select() {
+        this.$refs.input.select();
       }
     },
     mounted() {

+ 31 - 0
test/unit/specs/input-number.spec.js

@@ -396,4 +396,35 @@ describe('InputNumber', () => {
       done();
     });
   });
+
+  describe('InputNumber Methods', () => {
+    it('method:select', done => {
+      const testContent = '123';
+
+      vm = createVue({
+        template: `
+          <el-input-number
+            ref="inputNumComp"
+            :value="${testContent}"
+          />
+        `
+      }, true);
+
+      expect(vm.$refs.inputNumComp.$refs.input.$refs.input.selectionStart)
+        .to.equal(testContent.length);
+      expect(vm.$refs.inputNumComp.$refs.input.$refs.input.selectionEnd)
+        .to.equal(testContent.length);
+
+      vm.$refs.inputNumComp.select();
+
+      vm.$nextTick(_ => {
+        expect(vm.$refs.inputNumComp.$refs.input.$refs.input.selectionStart)
+          .to.equal(0);
+        expect(vm.$refs.inputNumComp.$refs.input.$refs.input.selectionEnd)
+          .to.equal(testContent.length);
+
+        done();
+      });
+    });
+  });
 });

+ 26 - 0
test/unit/specs/input.spec.js

@@ -300,4 +300,30 @@ describe('Input', () => {
       });
     });
   });
+
+  describe('Input Methods', () => {
+    it('method:select', done => {
+      const testContent = 'test';
+
+      vm = createVue({
+        template: `
+          <el-input
+            ref="inputComp"
+            value="${testContent}"
+          />
+        `
+      }, true);
+
+      expect(vm.$refs.inputComp.$refs.input.selectionStart).to.equal(testContent.length);
+      expect(vm.$refs.inputComp.$refs.input.selectionEnd).to.equal(testContent.length);
+
+      vm.$refs.inputComp.select();
+
+      vm.$nextTick(_ => {
+        expect(vm.$refs.inputComp.$refs.input.selectionStart).to.equal(0);
+        expect(vm.$refs.inputComp.$refs.input.selectionEnd).to.equal(testContent.length);
+        done();
+      });
+    });
+  });
 });