From fed3e09d154d9da3cba89b5872358cea864d7243 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=A2=81=E7=81=8F?= Date: Wed, 23 Aug 2017 14:42:54 +0800 Subject: [PATCH] add AutoComplete component --- examples/app.vue | 1 + examples/main.js | 4 + examples/routers/auto-complete.vue | 40 ++++++ .../auto-complete/auto-complete.vue | 130 ++++++++++++++++++ src/components/auto-complete/index.js | 2 + src/components/input/input.vue | 9 +- src/components/select/option.vue | 9 +- src/components/select/select.vue | 71 ++++++---- src/index.js | 2 + src/styles/components/auto-complete.less | 15 ++ src/styles/components/index.less | 3 +- 11 files changed, 255 insertions(+), 31 deletions(-) create mode 100644 examples/routers/auto-complete.vue create mode 100644 src/components/auto-complete/auto-complete.vue create mode 100644 src/components/auto-complete/index.js create mode 100644 src/styles/components/auto-complete.less diff --git a/examples/app.vue b/examples/app.vue index 87f3d9e0..7cfc088d 100644 --- a/examples/app.vue +++ b/examples/app.vue @@ -56,6 +56,7 @@ li + li { border-left: solid 1px #bbb; padding-left: 10px; margin-left: 10px; }
  • Notice
  • Avatar
  • ColorPicker
  • +
  • AutoComplete
  • diff --git a/examples/main.js b/examples/main.js index 3d4cad49..8937994e 100644 --- a/examples/main.js +++ b/examples/main.js @@ -188,6 +188,10 @@ const router = new VueRouter({ { path: '/color-picker', component: require('./routers/color-picker.vue') + }, + { + path: '/auto-complete', + component: require('./routers/auto-complete.vue') } ] }); diff --git a/examples/routers/auto-complete.vue b/examples/routers/auto-complete.vue new file mode 100644 index 00000000..17d983cf --- /dev/null +++ b/examples/routers/auto-complete.vue @@ -0,0 +1,40 @@ + + \ No newline at end of file diff --git a/src/components/auto-complete/auto-complete.vue b/src/components/auto-complete/auto-complete.vue new file mode 100644 index 00000000..6dd9b3ca --- /dev/null +++ b/src/components/auto-complete/auto-complete.vue @@ -0,0 +1,130 @@ + + \ No newline at end of file diff --git a/src/components/auto-complete/index.js b/src/components/auto-complete/index.js new file mode 100644 index 00000000..9fe71553 --- /dev/null +++ b/src/components/auto-complete/index.js @@ -0,0 +1,2 @@ +import AutoComplete from './auto-complete.vue'; +export default AutoComplete; \ No newline at end of file diff --git a/src/components/input/input.vue b/src/components/input/input.vue index f13d072e..7c034ee0 100644 --- a/src/components/input/input.vue +++ b/src/components/input/input.vue @@ -212,12 +212,19 @@ this.textareaStyles = calcTextareaHeight(this.$refs.textarea, minRows, maxRows); }, - focus() { + focus () { if (this.type === 'textarea') { this.$refs.textarea.focus(); } else { this.$refs.input.focus(); } + }, + blur () { + if (this.type === 'textarea') { + this.$refs.textarea.blur(); + } else { + this.$refs.input.blur(); + } } }, watch: { diff --git a/src/components/select/option.vue b/src/components/select/option.vue index da1ddf7c..1adf7d9c 100644 --- a/src/components/select/option.vue +++ b/src/components/select/option.vue @@ -3,6 +3,7 @@