开发搜索记录

pages/childClassify/index.js

@@ -22,7 +22,7 @@ Page({
     text: '',
     currentId: '',
     navBarTitle: '',
-    historySearch: wx.getStorageSync('search')
+    historySearch: []
   },
   /**
    * 生命周期函数--监听页面加载
@@ -46,6 +46,7 @@ Page({
     })
     this.setData({
       type: options.type,
+      historySearch: wx.getStorageSync('search'),
       navBarTitle: options.title
     })
     this.storeBindings = createStoreBindings(this, {
@@ -87,19 +88,44 @@ Page({
   },
   async search() {
     if (!this.data.text) {
+      this.setData({
+        list: []
+      })
       return
     }
     let list = await searchWorks({
       title: this.data.text,
       grade: this.data.userInfo.grade
     })
-    console.log(list);
+    if (!this.data.historySearch.includes(this.data.text)) {
+      this.setData({
+        historySearch: [...this.data.historySearch, this.data.text]
+      })
+    }
     this.setData({
       list,
-      historySearch: [...this.data.historySearch, this.data.text]
     })
     wx.setStorageSync('search', this.data.historySearch)
   },
+  historySearch({
+    currentTarget
+  }) {
+    this.setData({
+      text: currentTarget.dataset.text
+    })
+    this.search()
+  },
+  deleteHistory({
+    currentTarget
+  }) {
+    let newList = this.data.historySearch.filter(item => {
+      return item != currentTarget.dataset.text
+    })
+    this.setData({
+      historySearch: newList
+    })
+    wx.setStorageSync('search', newList)
+  },
   goRead({
     currentTarget
   }) {

pages/childClassify/index.less

@@ -168,12 +168,32 @@
   }
 
   .historyList {
+    padding: 80rpx 30rpx 0rpx;
+
     .notes {
       display: flex;
       align-items: center;
       justify-content: space-between;
-      .clock{
-        
+      padding: 30rpx 0rpx 14rpx;
+      border-bottom: 1rpx solid #DDDDDD;
+
+      .left {
+        display: flex;
+        align-items: center;
+        font-size: 28rpx;
+
+        .clock {
+          width: 34rpx;
+          height: 34rpx;
+          margin-right: 16rpx;
+        }
+      }
+
+      .delete {
+        color: #A4A4A5;
+        font-size: 50rpx;
+        line-height: 40rpx;
+        padding: 0rpx 20rpx;
       }
     }
   }

pages/childClassify/index.wxml

@@ -8,18 +8,19 @@
     </view>
   </scroll-view>
   <view class="searchBox" wx:if="{{type=='search'}}">
-    <input class="input" placeholder="请输入搜索内容" bindconfirm='search' confirm-type='send' bindinput="setSearch" />
+    <input class="input" placeholder="请输入搜索内容" bindconfirm='search' confirm-type='send' bindinput="setSearch"
+      value="{{text}}" />
     <view class="searchBtn" catchtap="search">
       <image src="/static/search-2.png" class="img" />
     </view>
   </view>
-  <view class="historyList">
-    <view class="notes">
+  <view class="historyList" wx:if="{{text==''&&list.length==0}}">
+    <view class="notes" wx:for="{{historySearch}}" wx:key="index" data-text="{{item}}" bindtap="historySearch">
       <view class="left">
         <image src="/static/clock.png" class="clock" />
-        哈哈啊污染哇额哇
+        {{item}}
       </view>
-      <view class="delete">
+      <view class="delete" data-text="{{item}}" catchtap="deleteHistory">
         ×
       </view>
     </view>

pages/childClassify/index.wxss

@@ -145,10 +145,31 @@
   box-shadow: 0 4rpx 10rpx 0 rgba(50, 197, 255, 0.46);
   border-radius: 50rpx;
 }
+.classBox .historyList {
+  padding: 80rpx 30rpx 0rpx;
+}
 .classBox .historyList .notes {
   display: flex;
   align-items: center;
   justify-content: space-between;
+  padding: 30rpx 0rpx 14rpx;
+  border-bottom: 1rpx solid #DDDDDD;
+}
+.classBox .historyList .notes .left {
+  display: flex;
+  align-items: center;
+  font-size: 28rpx;
+}
+.classBox .historyList .notes .left .clock {
+  width: 34rpx;
+  height: 34rpx;
+  margin-right: 16rpx;
+}
+.classBox .historyList .notes .delete {
+  color: #A4A4A5;
+  font-size: 50rpx;
+  line-height: 40rpx;
+  padding: 0rpx 20rpx;
 }
 .empty {
   margin-top: 300rpx;