小程序顶部搜索框怎么实现

发布日期： 2020-03-26 阅读量： 作者： 网络

这篇文章主要为大家详细介绍了小程序实现搜索框功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

小程序顶部搜索框怎么实现

小程序顶部搜索框怎么实现

实现效果如下：

具体代码：

1、WXML文件

<!--搜索框 -->
<view>
 <view>
 <!--点击之后，出现input框 -->
 <view>
  <icon></icon>
  <input>
  <!--输入款字数大于0，则显示清除按钮 -->
  <view> 0}}" bindtap="clearInput"&gt;
  <icon></icon>
  </view>
 </view>
 <!--没点击之前，只是一些文字和图标 -->
 <label>
  <icon></icon>
  <view>搜索</view>
 </label>
 </view>
 <!--动态出现的“取消”键 -->
 <view>取消</view></view>

# 小程序 # 顶部 # 搜索框

上一篇: 帝国cms付费可见插件是什么

下一篇: 如何使用 CSS 实现可调位置和颜色的文字下划线样式？

小程序顶部搜索框怎么实现

随便看看