chenhaodong / mew-iview

Commit 0a48ac45a4ce4ab67d2f0c2634a7f75a2111e8f4

Authored by 梁灏
1 parent c571d9ec

Input add readonly prop & focus、blur events 

Input add readonly prop & focus、blur events
Showing 8 changed files with 78 additions and 4 deletions   Show diff stats
Inline Side-by-side
src/components/cascader/cascader.vue 0 → 100644
  Show/Hide comments   View file @0a48ac4
  1 +<template>
  2 +
  3 +</template>
  4 +<script>
  5 + export default {
  6 + props: {
  7 +
  8 + },
  9 + data () {
  10 + return {
  11 +
  12 + }
  13 + },
  14 + computed: {
  15 +
  16 + },
  17 + methods: {
  18 +
  19 + }
  20 + }
  21 +</script>
0 22 \ No newline at end of file
... ...
src/components/cascader/index.js 0 → 100644
  Show/Hide comments   View file @0a48ac4
  1 +import Cascader from './cascader.vue';
  2 +export default Cascader;
0 3 \ No newline at end of file
... ...
src/components/input/input.vue
  Show/Hide comments   View file @0a48ac4
... ... @@ -9,8 +9,11 @@
9 9 :placeholder="placeholder"
10 10 :disabled="disabled"
11 11 :maxlength="maxlength"
  12 + :readonly="readonly"
12 13 v-model="value"
13   - @keyup.enter="handleEnter">
  14 + @keyup.enter="handleEnter"
  15 + @focus="handleFocus"
  16 + @blur="handleBlur">
14 17 <div :class="[prefixCls + '-group-append']" v-if="append" v-el:append><slot name="append"></slot></div>
15 18 </template>
16 19 <textarea
... ... @@ -22,8 +25,11 @@
22 25 :disabled="disabled"
23 26 :rows="rows"
24 27 :maxlength="maxlength"
  28 + :readonly="readonly"
25 29 v-model="value"
26   - @keyup.enter="handleEnter">
  30 + @keyup.enter="handleEnter"
  31 + @focus="handleFocus"
  32 + @blur="handleBlur">
27 33 </textarea>
28 34 </div>
29 35 </template>
... ... @@ -70,6 +76,10 @@
70 76 rows: {
71 77 type: Number,
72 78 default: 2
  79 + },
  80 + readonly: {
  81 + type: Boolean,
  82 + default: false
73 83 }
74 84 },
75 85 data () {
... ... @@ -117,6 +127,12 @@
117 127 handleIconClick () {
118 128 this.$emit('on-click');
119 129 },
  130 + handleFocus () {
  131 + this.$emit('on-focus');
  132 + },
  133 + handleBlur () {
  134 + this.$emit('on-blur');
  135 + },
120 136 resizeTextarea () {
121 137 const autosize = this.autosize;
122 138 if (!autosize || this.type !== 'textarea') {
... ...
src/index.js
  Show/Hide comments   View file @0a48ac4
... ... @@ -5,6 +5,7 @@ import Badge from &#39;./components/badge&#39;;
5 5 import Breadcrumb from './components/breadcrumb';
6 6 import Button from './components/button';
7 7 import Card from './components/card';
  8 +import Cascader from './components/cascader';
8 9 import Checkbox from './components/checkbox';
9 10 import Circle from './components/circle';
10 11 import Collapse from './components/collapse';
... ... @@ -40,6 +41,7 @@ const iview = {
40 41 iButton: Button,
41 42 ButtonGroup: Button.Group,
42 43 Card,
  44 + Cascader,
43 45 Checkbox,
44 46 CheckboxGroup: Checkbox.Group,
45 47 Circle,
... ...
test/app.vue
  Show/Hide comments   View file @0a48ac4
... ... @@ -41,6 +41,7 @@ li + li {
41 41 <li><a v-link="'/alert'">Alert</a></li>
42 42 <li><a v-link="'/tag'">Tag</a></li>
43 43 <li><a v-link="'/input'">Input</a></li>
  44 + <li><a v-link="'/cascader'">Cascader</a></li>
44 45 </ul>
45 46 </nav>
46 47 <router-view></router-view>
... ...
test/main.js
  Show/Hide comments   View file @0a48ac4
... ... @@ -92,6 +92,11 @@ router.map({
92 92 component: function (resolve) {
93 93 require(['./routers/tooltip.vue'], resolve);
94 94 }
  95 + },
  96 + '/cascader': {
  97 + component: function (resolve) {
  98 + require(['./routers/cascader.vue'], resolve);
  99 + }
95 100 }
96 101 });
97 102  
... ...
test/routers/cascader.vue 0 → 100644
  Show/Hide comments   View file @0a48ac4
  1 +<template>
  2 +
  3 +</template>
  4 +<script>
  5 + export default {
  6 + props: {
  7 +
  8 + },
  9 + data () {
  10 + return {
  11 +
  12 + }
  13 + },
  14 + computed: {
  15 +
  16 + },
  17 + methods: {
  18 +
  19 + }
  20 + }
  21 +</script>
0 22 \ No newline at end of file
... ...
test/routers/input.vue
  Show/Hide comments   View file @0a48ac4
1 1 <template>
2   - <i-input icon="ios-clock-outline" style="width:200px;" :value.sync="v" @on-enter="enter" @on-click="iconclick" size="large" placeholder="请输入"></i-input>
  2 + <i-input icon="ios-clock-outline" @on-focus="focus" @on-blur="blur" readonly style="width:200px;" :value.sync="v" @on-enter="enter" @on-click="iconclick" size="large" placeholder="请输入"></i-input>
3 3 <i-input icon="ios-clock-outline" style="width:200px;" :value.sync="v" @on-enter="enter" placeholder="请输入"></i-input>
4 4 <i-input icon="ios-clock-outline" style="width:200px;" :value.sync="v" @on-enter="enter" size="small" placeholder="请输入"></i-input>
5 5 <br>
... ... @@ -10,7 +10,7 @@
10 10 {{ v }}
11 11 <br>
12 12 <br>
13   - <i-input placeholder="this is something" style="width:200px;" :value.sync="t" type="textarea" :autosize="autosize"></i-input>
  13 + <i-input readonly placeholder="this is something" style="width:200px;" :value.sync="t" type="textarea" :autosize="autosize"></i-input>
14 14 {{ t }}
15 15 <br>
16 16 <br>
... ... @@ -116,6 +116,12 @@
116 116 },
117 117 change (val) {
118 118 console.log(val)
  119 + },
  120 + focus () {
  121 + this.$Message.info('focus');
  122 + },
  123 + blur () {
  124 + this.$Message.info('blur');
119 125 }
120 126 }
121 127 }
... ...