blog的前端代码
view | history | commit | commitdiff
inleft
2022-01-15 41b36f013d4103ffc59fd58feb6b6177ee5b04f7
commit | author | age
41b36f 1 <template>
I 2         <a-row type="flex" justify="start" >
3             <a-col v-bind="showSmall">
4                 <router-link to="/main1">Home »</router-link>
5             </a-col>
6             <a-col v-bind="showSmall">
7                 <router-link to="/main2">乐谱搜索 »</router-link>
8             </a-col>
9             <a-col v-bind="showSmall">
10                 <router-link to="/main3">动漫搜索 »</router-link>
11             </a-col>
12             <a-col v-bind="showMain">
13                 <router-link to="/tagInfo">关于我 »</router-link>
14             </a-col>
15             <a-col v-bind="showMain">
16                 <a-auto-complete v-bind="search" @select="onSelect" @search="onSearch" @change="onChange">
17                     <a-input>
18                         <a-icon slot="suffix" type="search" class="certain-category-icon" />
19                     </a-input>
20                 </a-auto-complete>
21             </a-col>
22             
23         </a-row>
24
25 </template>
26
27 <script>
28     export default {
29
30         data() {
31             return {
32                 search: {
33                     placeholder: "全局搜索..",
34                     allowClear: true,
35                     // autoFocus: true,
36                     backfill: true,
37                     dataSource: [],
38                 },
39                 showSmall: {
40                     xs: 6,
41                     sm: 6,
42                     md: 6,
43                     lg: 6,
44                     xl: 6,
45                     xxl: 6,
46                 },
47                 showMain: {
48                     xs: 0,
49                     sm: 0,
50                     md: 2,
51                     lg: 2,
52                     xl: 2,
53                     xxl: 2,
54                 }
55             }
56
57         },
58         watch: {
59             value(val) {
60                 console.log('值:', val);
61             },
62         },
63         methods: {
64             onSearch(searchText) {
65                 this.dataSource = !searchText ? [] : [searchText, searchText.repeat(2), searchText.repeat(3)];
66                 console.log("补全..");
67             },
68             onSelect(value) {
69                 console.log('回车', value);
70             },
71             onChange(value) {
72                 console.log('修改', value);
73             },
74             keyListener(value) {
75                 console.log('ref', this.$refs.mySearch);
76                 console.log('键盘', value);
77             },
78         },
79     }
80 </script>