other / mew-iview

Commit 9d767f2084ca54417f0f0b1385b713626685c611

Authored by Aresn
Committed by GitHub
1 parent 5f25feca

Update auto-complete.vue

Showing 1 changed file with 35 additions and 36 deletions   Show diff stats
Inline Side-by-side
examples/routers/auto-complete.vue
  Show/Hide comments   View file @9d767f2
1 1 <template>
2   - <div style="margin: 100px;width: 200px;">
3   - <auto-complete v-model="value" :data="data" :disabled="disabled"></auto-complete>
4   - </div>
  2 + <div style="margin: 100px;width: 200px;">
  3 + <AutoComplete placement="top" transfer v-model="value" icon="ios-search" :data="data" @on-search="handleSearch" @on-change="hc" :filter-method="fm">
  4 + <!--<Option v-for="item in data" :value="item" :label="item" :key="item">-->
  5 + <!--<span style="color: red">{{ item }}</span>-->
  6 + <!--</Option>-->
  7 + </AutoComplete>
  8 + </div>
5 9 </template>
6 10 <script>
7   -export default {
8   - data() {
9   - return {
10   - value: "",
11   - disabled: false,
12   - data: []
  11 +
  12 + export default {
  13 + props: {
  14 +
  15 + },
  16 + data () {
  17 + return {
  18 + value: '',
  19 + data: [],
  20 +// data: ['Burns Bay Road', 'Downing Street', 'Wall Street']
  21 + };
  22 + },
  23 + computed: {},
  24 + methods: {
  25 + handleSearch (value) {
  26 + this.data = !value ? [] : [
  27 + value + '@qq.com',
  28 + value + '@sina.com',
  29 + value + '@163.com'
  30 + ]
  31 + },
  32 + hc (v) {
  33 +// console.log(v)
  34 + },
  35 + fm (value, item) {
  36 + return item.toUpperCase().indexOf(value.toUpperCase()) !== -1;
  37 + }
  38 + }
13 39 };
14   - },
15   - methods: {},
16   - created() {
17   - setTimeout(() => {
18   - this.value = "1.0.0.5";
19   - this.data = [
20   - "12412515",
21   - "123444",
22   - "12355",
23   - "12345",
24   - "12312",
25   - "1234",
26   - "123",
27   - "111",
28   - "5.2.3.4",
29   - "1.2.3.4",
30   - "1.2.3.4.5",
31   - "1.2.3.4.5.6",
32   - "1.2.3.4.5.6.7",
33   - "1.0.0.8",
34   - "1.0.0.5",
35   - "whb-03"
36   - ];
37   - // this.disabled = true;
38   - }, 1000);
39   - }
40   -};
41 40 </script>
... ...