inleft
2022-02-25 fc0c102554f509989dd74b199f298a67f266c3c8
commit | author | age
56a4b8 1 <template>
I 2     <div class="blog-cell ">
3         <div class="blog-container">
4             <div class="blog-user-message blog-cell ">
5                 <span>{{searchType}}</span>
6                 <hr>
7                 <div>
8                     <a-auto-complete v-bind="search" @select="onSelect" @search="onSearch" @change="onChange">
fc0c10 9                         <a-input @pressEnter="onSelect">
56a4b8 10                             <a-icon slot="suffix" type="search" class="certain-category-icon" />
I 11                         </a-input>
12                     </a-auto-complete>
13                 </div>
14                 <hr>
15                 <span>{{sentence}}</span>
16             </div>
17         </div>
18     </div>
19
20 </template>
21
22 <script>
23     export default {
24         name: "box",
25         props: {
26             searchType: ""
27         },
28         data() {
29             return {
30                 sentence: "十里寒塘路,烟花一半醒",
31                 search: {
32                     placeholder: "搜索..",
33                     // autoFocus: true,
34                     backfill: true,
fc0c10 35                     value: '',
56a4b8 36                     dataSource: [],
I 37                 },
38             }
39         },
40         methods: {
41             onSearch(searchText) {
42                 this.dataSource = !searchText ? [] : [searchText, searchText.repeat(2), searchText.repeat(3)];
43                 console.log("补全..");
44             },
45             onSelect(value) {
fc0c10 46                 this.$message.info("更多功能..敬请期待")
56a4b8 47                 console.log('回车', value);
I 48             },
49             onChange(value) {
50                 console.log('修改', value);
51             },
52             keyListener(value) {
53                 console.log('ref', this.$refs.mySearch);
54                 console.log('键盘', value);
55             },
56         },
57     }
58 </script>
59
60 </script>
61
62 <style lang="less">
63
64 </style>