微信小程序搜索框回车搜索事件

原创

reg183 2022-06-06 18:08:11 博主文章分类：前端 ©著作权

文章标签 ico 搜索 ide 文章分类 运维

©著作权归作者所有：来自51CTO博客作者reg183的原创作品，请联系作者获取转载授权，否则将追究法律责任

<view class="weui-search-bar">
            <view class="weui-search-bar__form">
                <view class="weui-search-bar__box">
                    <icon class="weui-icon-search_in-box" type="search" size="14"></icon>
                    <input type="text" class="weui-search-bar__input" placeholder="搜索" value="{{inputVal}}"
 focus="{{inputShowed}}" bindinput="inputTyping"  bindconfirm="onShow" />
                    <view class="weui-icon-clear" wx:if="{{inputVal.length > 0}}" bindtap="clearInput">
                        <icon type="clear" size="14"></icon>
                    </view>
                </view>
                <label class="weui-search-bar__label" hidden="{{inputShowed}}" bindtap="showInput">
                    <icon class="weui-icon-search" type="search" size="14"></icon>
                    <view class="weui-search-bar__text">搜索</view>
                </label>
            </view>
            <view class="weui-search-bar__cancel-btn" hidden="{{!inputShowed}}" bindtap="hideInput">取消</view>
    </view>