<div class="historydata" v-show="input">
? ? ? ? ? ? <div>歷史搜索</div>
? ? ? ? ? ? <ul class="">
? ? ? ? ? ? ? <li v-for="(item, index) in historyList" :key="index" class="text">
? ? ? ? ? ? ? ? {{ item }}
? ? ? ? ? ? ? </li>
? ? ? ? ? ? </ul>
? ? ? ? ? </div>
?mounted() {
? ? if (JSON.parse(localStorage.getItem("historyList"))) {
? ? ? this.historyList = JSON.parse(localStorage.getItem("historyList"));
? ? }
? },
點(diǎn)擊搜索調(diào)下邊這個方法
? ? ? hostoryfilter(){
??
? ? ??
? ? ? if (this.input == "") {
? ? ? ? // this.$toast('請輸入搜索內(nèi)容');
? ? ? ? return false;
? ? ? } else {
? ? ? ? // 沒有搜索記錄，把搜索值push進(jìn)數(shù)組首位，存入本地
? ? ? ? if (!this.historyList.includes(this.input)) {
? ? ? ? ? this.historyList.unshift(this.input);
? ? ? ? ? localStorage.setItem("historyList", JSON.stringify(this.historyList));
? ? ? ? } else {
? ? ? ? ? //有搜索記錄，刪除之前的舊記錄，將新搜索值重新push到數(shù)組首位
? ? ? ? ? let i = this.historyList.indexOf(this.input);
? ? ? ? ? this.historyList.splice(i, 1);
? ? ? ? ? this.historyList.unshift(this.input);
? ? ? ? ? localStorage.setItem("historyList", JSON.stringify(this.historyList));
? ? ? ? }
? ? ? ? if(this.historyList.length == 50){
? ? ? ? ? this.historyList = []
? ? ? ? }
? ? ? }文章來源：http://www.zghlxwxcb.cn/news/detail-456970.html
? ? ? },文章來源地址http://www.zghlxwxcb.cn/news/detail-456970.html
到了這里，關(guān)于前端如何實現(xiàn)搜索記錄展示以及清楚歷史搜索記錄的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
![【NLP】什么是語義搜索以及如何實現(xiàn) [Python、BERT、Elasticsearch]](https://imgs.yssmx.com/Uploads/2024/02/758660-1.jpeg)
