[UI] 添加搜索界面
This commit is contained in:
parent
34c33c4013
commit
cd06b90806
4
app.json
4
app.json
|
@ -5,7 +5,9 @@
|
||||||
"pages/author-list/author-list",
|
"pages/author-list/author-list",
|
||||||
"pages/favorite/favorite",
|
"pages/favorite/favorite",
|
||||||
"pages/poem-detail/poem-detail",
|
"pages/poem-detail/poem-detail",
|
||||||
"pages/author-detail/author-detail"
|
"pages/author-detail/author-detail",
|
||||||
|
"pages/search/search",
|
||||||
|
"pages/search-result/search-result"
|
||||||
],
|
],
|
||||||
"window": {
|
"window": {
|
||||||
"backgroundTextStyle": "light",
|
"backgroundTextStyle": "light",
|
||||||
|
|
|
@ -43,6 +43,11 @@ Page({
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
search: function () {
|
||||||
|
wx.navigateTo({
|
||||||
|
url: '/pages/search/search',
|
||||||
|
})
|
||||||
|
},
|
||||||
// 更换分类
|
// 更换分类
|
||||||
changeCategorys(e) {
|
changeCategorys(e) {
|
||||||
let select = e.detail.value
|
let select = e.detail.value
|
||||||
|
|
|
@ -3,6 +3,7 @@
|
||||||
"t-tabs": "tdesign-miniprogram/tabs/tabs",
|
"t-tabs": "tdesign-miniprogram/tabs/tabs",
|
||||||
"t-tab-panel": "tdesign-miniprogram/tab-panel/tab-panel",
|
"t-tab-panel": "tdesign-miniprogram/tab-panel/tab-panel",
|
||||||
"poem-list": "/components/poem-list/poem-list",
|
"poem-list": "/components/poem-list/poem-list",
|
||||||
"poem-translate": "/components/poem-translate/poem-translate"
|
"poem-translate": "/components/poem-translate/poem-translate",
|
||||||
|
"t-search": "tdesign-miniprogram/search/search"
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -8,5 +8,8 @@
|
||||||
wx:key="id"
|
wx:key="id"
|
||||||
value="{{item.id}}" />
|
value="{{item.id}}" />
|
||||||
</t-tabs>
|
</t-tabs>
|
||||||
|
<view class="search-box">
|
||||||
|
<t-search placeholder="搜索诗词/作者/内容" center bind:focus="search" />
|
||||||
|
</view>
|
||||||
<poem-list poems="{{poems}}" status="{{status}}" />
|
<poem-list poems="{{poems}}" status="{{status}}" />
|
||||||
</view>
|
</view>
|
|
@ -1,3 +1,7 @@
|
||||||
.tabs {
|
.tabs {
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-box {
|
||||||
|
padding: 20rpx 20rpx;
|
||||||
}
|
}
|
|
@ -0,0 +1,66 @@
|
||||||
|
// pages/search-result/search-result.js
|
||||||
|
Page({
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 页面的初始数据
|
||||||
|
*/
|
||||||
|
data: {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面加载
|
||||||
|
*/
|
||||||
|
onLoad(options) {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面初次渲染完成
|
||||||
|
*/
|
||||||
|
onReady() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面显示
|
||||||
|
*/
|
||||||
|
onShow() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面隐藏
|
||||||
|
*/
|
||||||
|
onHide() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面卸载
|
||||||
|
*/
|
||||||
|
onUnload() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 页面相关事件处理函数--监听用户下拉动作
|
||||||
|
*/
|
||||||
|
onPullDownRefresh() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 页面上拉触底事件的处理函数
|
||||||
|
*/
|
||||||
|
onReachBottom() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 用户点击右上角分享
|
||||||
|
*/
|
||||||
|
onShareAppMessage() {
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
|
@ -0,0 +1,3 @@
|
||||||
|
{
|
||||||
|
"usingComponents": {}
|
||||||
|
}
|
|
@ -0,0 +1,2 @@
|
||||||
|
<!--pages/search-result/search-result.wxml-->
|
||||||
|
<text>pages/search-result/search-result.wxml</text>
|
|
@ -0,0 +1 @@
|
||||||
|
/* pages/search-result/search-result.wxss */
|
|
@ -0,0 +1,68 @@
|
||||||
|
// pages/search/search.js
|
||||||
|
Page({
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 页面的初始数据
|
||||||
|
*/
|
||||||
|
data: {
|
||||||
|
recommend: [
|
||||||
|
'此处均为测试数据!', '黄鹤楼', '扬州', '春', '黄鹤楼送孟浩然之广陵', '瀑布', '李白', '忆江南'
|
||||||
|
]
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面加载
|
||||||
|
*/
|
||||||
|
onLoad(options) {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面初次渲染完成
|
||||||
|
*/
|
||||||
|
onReady() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面显示
|
||||||
|
*/
|
||||||
|
onShow() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面隐藏
|
||||||
|
*/
|
||||||
|
onHide() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面卸载
|
||||||
|
*/
|
||||||
|
onUnload() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 页面相关事件处理函数--监听用户下拉动作
|
||||||
|
*/
|
||||||
|
onPullDownRefresh() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 页面上拉触底事件的处理函数
|
||||||
|
*/
|
||||||
|
onReachBottom() {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 用户点击右上角分享
|
||||||
|
*/
|
||||||
|
onShareAppMessage() {
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
|
@ -0,0 +1,6 @@
|
||||||
|
{
|
||||||
|
"usingComponents": {
|
||||||
|
"t-search": "tdesign-miniprogram/search/search",
|
||||||
|
"t-tag": "tdesign-miniprogram/tag/tag"
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,9 @@
|
||||||
|
<view class="search-container">
|
||||||
|
<t-search placeholder="搜索诗句/作者/内容" center />
|
||||||
|
<view class="recommend-title">最多搜索:</view>
|
||||||
|
<view class="recommend-list">
|
||||||
|
<t-tag class="recommend-tag"
|
||||||
|
wx:for="{{recommend}}"
|
||||||
|
wx:for-item="tag">{{tag}}</t-tag>
|
||||||
|
</view>
|
||||||
|
</view>
|
|
@ -0,0 +1,16 @@
|
||||||
|
.search-container {
|
||||||
|
padding: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend-title {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend-list {
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recommend-tag {
|
||||||
|
margin: 10rpx 10rpx;
|
||||||
|
}
|
|
@ -28,6 +28,13 @@
|
||||||
"query": "",
|
"query": "",
|
||||||
"launchMode": "default",
|
"launchMode": "default",
|
||||||
"scene": null
|
"scene": null
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "search",
|
||||||
|
"pathName": "pages/search/search",
|
||||||
|
"query": "",
|
||||||
|
"launchMode": "default",
|
||||||
|
"scene": null
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue