查漏补缺——说说@keyup.enter

问题

如题所示

答案

vue中输入框事件的使用——@input、@keyup.enter、@change、@blur

相关源码如下：

<div class="header-search">
        <i class="iconfont iconsearch" @click.stop="click"></i>
        <input ref="searchInput" :class="{'show':show}" v-model="searchValue" type="text" @click.stop="" @keyup.enter="search"/>
    </div>

search(){
                // console.log(this.searchValue)
                this.$router.push({name:'search',params:{words:this.searchValue}});
                this.close()
            }

按照上面的源码，在输入框输入的时候，就调用search这个函数，这个函数的作用应该是将输入框输入的文字和search这个路由重新拼接成一个新的地址（url）

大致做成来的效果是这样的：