新聞中心
這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷解決方案
創(chuàng)新互聯(lián)百度小程序教程:page-search搜索頁(yè)模板
- page-search 搜索頁(yè)模板
- 示例
- 頁(yè)面內(nèi)容
- 搜索頁(yè)模板
- npm 依賴
- Bug & Tip
page-search 搜索頁(yè)模板
從開(kāi)發(fā)者工具 v2.25.1-rc 版本開(kāi)始支持。
萊西ssl適用于網(wǎng)站、小程序/APP、API接口等需要進(jìn)行數(shù)據(jù)傳輸應(yīng)用場(chǎng)景,ssl證書(shū)未來(lái)市場(chǎng)廣闊!成為成都創(chuàng)新互聯(lián)的ssl證書(shū)銷售渠道,可以享受市場(chǎng)價(jià)格4-6折優(yōu)惠!如果有意向歡迎電話聯(lián)系或者加微信:13518219792(備注:SSL證書(shū)合作)期待與您的合作!
解釋:搜索頁(yè)模板。包括搜索框、搜索推薦、搜索運(yùn)營(yíng)、搜索結(jié)果列表等內(nèi)容。
示例
掃碼體驗(yàn)
代碼示例
請(qǐng)使用百度APP掃碼
頁(yè)面內(nèi)容
搜索頁(yè)模板
包括導(dǎo)航欄、搜索框、搜索歷史區(qū)域、搜索推薦區(qū)域、搜索推薦列表、搜索結(jié)果列表等內(nèi)容,開(kāi)發(fā)者可根據(jù)自身需要添加或刪除模塊。
頁(yè)面路徑:index/index
代碼示例
- SWAN
- JSON
title="搜索"has-back="{{showBack}}"backgroundColor="#fff"bindnavigateback="navigateBack">search-icon-color="#999"placeholder="{{searchPlaceholder}}"preset-word="{{searchPresetword}}"value="{=searchValue=}"focus="{=isFocus=}"bindsearch="search"bindclear="clear"bindinput="input"bindfocus="focus"theme="white"/>title="歷史搜索"max-height="367.75rpx"s-if="historyItems.length > 0 && searchValue == ''">全部刪除 完成 class="history-label history-label-{{item.status}}"hover-class="history-label-hover"hover-start-time="0"hover-stay-time="0"data-status="{{item.status}}"data-index="{{index}}"data-value="{{item.label}}"catchtap="historyLabelTap"bindlongpress="historyLableLongpress">{{item.label}}class="icon-delete"s-if="item.status === 1"name="delete"color="#999"size="21.74rpx">title="大家都在搜"max-height="289.86rpx"s-if="operateItems.length > 0 && searchValue == ''">class="operate-item {{index % 2 == 0 ? '' : 'operate-odd'}}"hover-class="operate-item-hover"hover-stay-time="100"bindtap="operateItemTap"data-item="{{item}}">{{item}}class="suggestion-item-container"hover-class="suggestion-item-hover"hover-stay-time="100"bindtap="suggestionTap"data-item="{{item.label}}">{{text}} class="search-result-item-container"hover-class="search-result-item-hover"hover-stay-time="100"data-item="{{item}}"bindtap="resultItemTap">{{text}} {{item.desc}} class="search-status"loading="{{pageStatus.loading}}"loading-title="{{pageStatus.loadingTitle}}"bind:smtreloading="reloading"title="{{pageStatus.title}}"desc="{{pageStatus.desc}}"icon="{{pageStatus.icon}}"showBtn="{{pageStatus.showBtn}}"btnText="{{pageStatus.btnText}}">
{"navigationBarTitleText": "智能小程序示例","navigationStyle": "custom","usingComponents": {"topbar": "../components/topbar/topbar","search-block": "../components/search-block/search-block","smt-search-bar": "@smt-ui/component/src/search-bar","smt-icon": "@smt-ui/component/src/icon","smt-page-status": "@smt-ui/component/src/page-status"}}
npm 依賴
| 名稱 | 版本號(hào) |
|---|---|
| @smt-ui/component | latest |
Bug & Tip
- Tip:該模板使用了 ES6 語(yǔ)法,需要開(kāi)啟開(kāi)發(fā)者工具的增強(qiáng)編譯,操作步驟參看開(kāi)啟說(shuō)明;同時(shí)也需開(kāi)啟上傳代碼時(shí)樣式自動(dòng)補(bǔ)全。
- Tip:以上代碼示例為小程序前端代碼,可直接在模擬器和真機(jī)預(yù)覽。
- Tip:模板中使用的是測(cè)試數(shù)據(jù),開(kāi)發(fā)者需要從接口中獲取真實(shí)的數(shù)據(jù)。
分享名稱:創(chuàng)新互聯(lián)百度小程序教程:page-search搜索頁(yè)模板
轉(zhuǎn)載來(lái)源:http://fisionsoft.com.cn/article/dhegoes.html


咨詢
建站咨詢

