From 06ee76d0a83854ad7a044689627e0f00a66e5ce5 Mon Sep 17 00:00:00 2001 From: lijh <lijh> Date: Wed, 19 Jan 2022 18:36:23 +0800 Subject: [PATCH] 表单校验 --- src/components/fixed/header.vue | 100 +++++++++++++++++++++++++++++++++++-------------- 1 files changed, 71 insertions(+), 29 deletions(-) diff --git a/src/components/fixed/header.vue b/src/components/fixed/header.vue index 1d70d32..8011ac1 100644 --- a/src/components/fixed/header.vue +++ b/src/components/fixed/header.vue @@ -1,36 +1,73 @@ <template> - <a-row type="flex" justify="start" > - <a-col v-bind="showSmall"> - <router-link to="/main1">Home »</router-link> - </a-col> - <a-col v-bind="showSmall"> - <router-link to="/main2">乐谱搜索 »</router-link> - </a-col> - <a-col v-bind="showSmall"> - <router-link to="/main3">动漫搜索 »</router-link> - </a-col> - <a-col v-bind="showMain"> - <router-link to="/tagInfo">关于我 »</router-link> - </a-col> - <a-col v-bind="showMain"> - <a-auto-complete v-bind="search" @select="onSelect" @search="onSearch" @change="onChange"> - <a-input> - <a-icon slot="suffix" type="search" class="certain-category-icon" /> - </a-input> - </a-auto-complete> - </a-col> - - </a-row> + <a-row type="flex" justify="start"> + <a-col v-bind="showSmall"> + <router-link to="/main1">Home »</router-link> + </a-col> + <a-col v-bind="showSmall"> + <router-link to="/main2">乐谱搜索 »</router-link> + </a-col> + <a-col v-bind="showSmall"> + <router-link to="/main3">我的网盘 »</router-link> + </a-col> + <a-col v-bind="showSmall"> + <router-link to="/main4">友人帐 »</router-link> + </a-col> + <a-col v-bind="showMain"> + <a-auto-complete ref="mySearch" v-bind="search" @select="onSelect" @search="onSearch" @change="onChange"> + <a-input @keydown.enter="onSelect"> + <a-icon slot="suffix" type="search" class="certain-category-icon" /> + </a-input> + </a-auto-complete> + </a-col> + + </a-row> </template> <script> export default { + mounted() { + let self = this; + let code = 0; + let code2 = 0; + let code3 = 0; + document.onkeydown = function(e) { + let evn = e || event; + let key = evn.keyCode || evn.which || evn.charCode; + if (key === 17) { + code = 1; + } + if (key === 16) { + code2 = 1; + } + if (key === 70) { + code3 = 1; + } + if (code === 1 && code2 === 1 && code3 === 1) { + self.$message.info("进入全局搜索..") + //do something + self.$refs.mySearch.focus(); + code = 0; + code2 = 0; + } + } + document.onkeyup = function(e) { + if (e.keyCode === 17) { + code = 0; + } + if (e.keyCode === 16) { + code2 = 0; + } + if (e.keyCode === 70) { + code3 = 0; + } + } + }, data() { return { search: { - placeholder: "全局搜索..", + placeholder: "ctrl+shift+f/enter", allowClear: true, // autoFocus: true, backfill: true, @@ -38,11 +75,11 @@ }, showSmall: { xs: 6, - sm: 6, - md: 6, - lg: 6, - xl: 6, - xxl: 6, + sm: 4, + md: 4, + lg: 4, + xl: 4, + xxl: 4, }, showMain: { xs: 0, @@ -61,12 +98,17 @@ }, }, methods: { + test(e) { + console.log(333); + console.log(e); + }, onSearch(searchText) { this.dataSource = !searchText ? [] : [searchText, searchText.repeat(2), searchText.repeat(3)]; console.log("补全.."); }, onSelect(value) { console.log('回车', value); + this.$message.info("回车") }, onChange(value) { console.log('修改', value); @@ -77,4 +119,4 @@ }, }, } -</script> \ No newline at end of file +</script> -- Gitblit v1.9.1