update: add some function

pages/classification/classification.js

@@ -1,4 +1,5 @@
-// pages/classification/classification.js
+const { ificationContent } = require('../../utils/data.js')
+
 Page({
 
   /**
@@ -24,162 +25,7 @@ Page({
       {title:"广播剧"},
       {title:"戏曲"}
     ],
-    ificationContent:[
-      {
-        title:"有声书",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"畅销书",
-        content:[
-          {text:"社科"},
-          {text:"经管"},
-          {text:"文学"},
-          {text:"励志"},
-          {text:"名著"},
-          {text:"生活"}
-        ]
-      },
-      {
-        title:"儿童",
-        content:[
-          {text:"故事"},
-          {text:"儿歌"},
-          {text:"动画"},
-          {text:"科普"},
-          {text:"名著"},
-          {text:"国学"}
-        ]
-      },
-      {
-        title:"相声评书",
-        content:[
-          {text:"单田芳"},
-          {text:"郭德纲"},
-          {text:"热门相声"},
-          {text:"单口相声"},
-          {text:"名家评书"},
-          {text:"新锐笑将"}
-        ]
-      },
-      {
-        title:"情感生活",
-        content:[
-          {text:"恋爱技巧"},
-          {text:"睡前夜话"},
-          {text:"情绪压力"},
-          {text:"婚姻家庭"},
-          {text:"个人成长"},
-          {text:"心理健康"}
-        ]
-      },
-      {
-        title:"人文",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"历史",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"国学书院",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"音乐",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"英语",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"教育培训",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"健康养生",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"广播剧",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-      {
-        title:"戏曲",
-        content:[
-          {text:"言情"},
-          {text:"悬疑"},
-          {text:"都市"},
-          {text:"幻想"},
-          {text:"武侠"},
-          {text:"历史"}
-        ]
-      },
-    ]
+    ificationContent:ificationContent
   },
 
 

pages/classification/classification.json

@@ -1,5 +1,5 @@
 {
 	"usingComponents": {
-		"search": "/component/search/search"
+		"search": "/components/search/search"
 	}
 }

pages/collection/collection.json

@@ -1,5 +1,5 @@
 {
 	"usingComponents": {
-		"search": "/component/search/search"
+		"search": "/components/search/search"
 	}
 }

pages/index/index.json

@@ -1,5 +1,5 @@
 {
 	"usingComponents": {
-		"search": "/component/search/search"
+		"search": "/components/search/search"
 	}
 }

pages/index/index.wxml

@@ -44,7 +44,7 @@
 	<!-- 这没有使用数据绑定，因为是练手而且数据比较少 -->
 	<view class="hmly-like-item-box">
 		<view class="hmly-like-item" bindtap="gotoDetails" data-coverImg="{{item.coverMiddle}}" data-title="{{item.intro}}"
-			wx:for="{{guess}}" wx:key="{{index}}">
+			wx:for="{{guess}}" wx:key="index">
 			<view class="hmly-like-img">
 				<image class="hmly-like-item-icon" src="{{item.coverMiddle}}" mode="widthFix"></image>
 				<view class="hmly-like-cover">

pages/search/search.js

@@ -1,10 +1,6 @@
-// pages/search/search.js
 Page({
-
-	/**
-	 * 页面的初始数据
-	 */
 	data: {
+		searchHistory: [],
 		hotData: [
 			{ title: "宝宝巴士", icon: "icon-jiantouUp", color: "text-orange" },
 			{ title: "孟鹤堂", icon: "icon-jiantouUp", color: "text-red" },
@@ -13,5 +9,30 @@ Page({
 			{ title: "儿童恐龙故事", icon: "icon-jiantouDown", color: "text-red" },
 			{ title: "儿童版三国演义", icon: "icon-jiantouUp", color: "text-red" },
 		]
+	},
+	/**
+	 * 搜索事件
+	 * @param {Object} e 
+	 */
+	search(e){
+		this.setData({
+			searchHistory: [...this.data.searchHistory,e.detail.value]
+		})
+	},
+	/**
+	 * 取消搜索事件
+	 */
+	cancelSearch(){
+		wx.navigateBack({
+			delta: 1,
+		})
+	},
+	/**
+	 * 清空历史记录
+	 */
+	clearHistory(){
+		this.setData({
+			searchHistory: []
+		})
 	}
 })

pages/search/search.wxml

@@ -2,23 +2,20 @@
 <view class="hmly-search">
 	<view class="hmly-search-left">
 		<text class="icon-search"></text>
-		<input placeholder="搜索你想听的节目"></input>
+		<input placeholder="搜索你想听的节目" bindconfirm="search"></input>
 	</view>
-	<view class="hmly-search-right">取消</view>
+	<view class="hmly-search-right" bindtap="cancelSearch">取消</view>
 </view>
 <!-- 搜索历史 -->
-<view class="hmly-history">
+<view class="hmly-history" wx:if="{{searchHistory.length}}">
 	<!-- 提示标题 -->
 	<view class="hmly-title">
 		<view class="hmly-title-text">搜索历史</view>
-		<text class="icon-delete text-gray"></text>
+		<text class="icon-delete text-gray" bindtap="clearHistory"></text>
 	</view>
 	<!-- 内容 -->
 	<view class="hmly-history-content">
-		<view class="hmly-content-item bg-gray text-black">庆余年</view>
-		<view class="hmly-content-item bg-gray text-black">德云社</view>
-		<view class="hmly-content-item bg-gray text-black">评书</view>
-		<view class="hmly-content-item bg-gray text-black">英语</view>
+		<view class="hmly-content-item bg-gray text-black" wx:for="{{searchHistory}}" wx:key="index">{{item}}</view>
 	</view>
 </view>
 <!-- 热门搜索 -->

pages/search/search.wxss

@@ -67,17 +67,15 @@
 	height: auto;
 	margin-top: 30rpx;
 	display: flex;
-	justify-content: space-between;
 	flex-wrap: wrap;
 	align-items: center;
 }
 
 .hmly-content-item {
-	width: 150rpx;
 	font-size: 33rpx;
 	text-align: center;
 	padding: 10rpx 20rpx;
-	margin-bottom: 20rpx;
+	margin: 0 20rpx 20rpx 0;
 	border-radius: 25rpx;
 }
 

project.config.json

@@ -40,7 +40,7 @@
     "useApiHostProcess": true
   },
   "compileType": "miniprogram",
-  "libVersion": "2.11.3",
+  "libVersion": "2.16.1",
   "appid": "wx101d03d3f1aab84c",
   "projectname": "%E4%BB%BF%E5%96%9C%E9%A9%AC%E6%8B%89%E9%9B%85lite",
   "debugOptions": {

utils/data.js

@@ -0,0 +1,160 @@
+const ificationContent = [
+  {
+    title:"有声书",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"畅销书",
+    content:[
+      {text:"社科"},
+      {text:"经管"},
+      {text:"文学"},
+      {text:"励志"},
+      {text:"名著"},
+      {text:"生活"}
+    ]
+  },
+  {
+    title:"儿童",
+    content:[
+      {text:"故事"},
+      {text:"儿歌"},
+      {text:"动画"},
+      {text:"科普"},
+      {text:"名著"},
+      {text:"国学"}
+    ]
+  },
+  {
+    title:"相声评书",
+    content:[
+      {text:"单田芳"},
+      {text:"郭德纲"},
+      {text:"热门相声"},
+      {text:"单口相声"},
+      {text:"名家评书"},
+      {text:"新锐笑将"}
+    ]
+  },
+  {
+    title:"情感生活",
+    content:[
+      {text:"恋爱技巧"},
+      {text:"睡前夜话"},
+      {text:"情绪压力"},
+      {text:"婚姻家庭"},
+      {text:"个人成长"},
+      {text:"心理健康"}
+    ]
+  },
+  {
+    title:"人文",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"历史",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"国学书院",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"音乐",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"英语",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"教育培训",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"健康养生",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"广播剧",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+  {
+    title:"戏曲",
+    content:[
+      {text:"言情"},
+      {text:"悬疑"},
+      {text:"都市"},
+      {text:"幻想"},
+      {text:"武侠"},
+      {text:"历史"}
+    ]
+  },
+]
+
+module.exports = {
+  ificationContent
+}

utils/request.js

@@ -1,7 +1,10 @@
 // 定义全局常量baseUrl用来存储前缀
 const baseURL = 'http://mobile.ximalaya.com/mobile/discovery/v3/recommend/hotAndGuess?code=43_310000_3100&device=android&version=5.4.45';
 
-
+/**
+ * 使用Promise对wx.request api进行封装
+ * @param {*} params 
+ */
 function request(params = { method, url, data }) {
 	return new Promise(function (resolve, reject) {
 		let header = { 'content-type': 'application/json' }; // 定义请求头
@@ -26,7 +29,6 @@ function request(params = { method, url, data }) {
 	})
 }
 
-
 // 向外暴露接口
 module.exports = {
 	request: request