You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 lines
2.8 KiB
1 lines
2.8 KiB
<view class="demo-container data-v-01e5139b"><view class="demo-title data-v-01e5139b">搜索组件演示</view><view class="demo-section data-v-01e5139b"><view class="section-title data-v-01e5139b">基础搜索框</view><search vue-id="3abde0cb-1" placeholder="请输入搜索内容" value="{{searchValue1}}" data-event-opts="{{[['^search',[['onSearch']]],['^clear',[['onClear']]],['^clickIcon',[['onClickIcon']]],['^input',[['__set_model',['','searchValue1','$event',[]]]]]]}}" bind:search="__e" bind:clear="__e" bind:clickIcon="__e" bind:input="__e" class="data-v-01e5139b" bind:__l="__l"></search><view class="result data-v-01e5139b">{{"搜索内容："+searchValue1}}</view></view><view class="demo-section data-v-01e5139b"><view class="section-title data-v-01e5139b">右侧搜索图标</view><search vue-id="3abde0cb-2" placeholder="搜索图标在右侧" searchIconAlign="right" value="{{searchValue2}}" data-event-opts="{{[['^search',[['onSearch']]],['^input',[['__set_model',['','searchValue2','$event',[]]]]]]}}" bind:search="__e" bind:input="__e" class="data-v-01e5139b" bind:__l="__l"></search></view><view class="demo-section data-v-01e5139b"><view class="section-title data-v-01e5139b">居中对齐</view><search vue-id="3abde0cb-3" placeholder="居中对齐的搜索框" textAlign="center" showIcon="{{false}}" value="{{searchValue3}}" data-event-opts="{{[['^search',[['onSearch']]],['^input',[['__set_model',['','searchValue3','$event',[]]]]]]}}" bind:search="__e" bind:input="__e" class="data-v-01e5139b" bind:__l="__l"></search></view><view class="section-title data-v-01e5139b">自定义样式</view><search vue-id="3abde0cb-4" placeholder="自定义背景色和高度" placeholderClass="{{({color:'red',fontSize:'24rpx'})}}" bgColor="#e8f4fd" height="100rpx" showCancel="{{false}}" value="{{searchValue4}}" data-event-opts="{{[['^search',[['onSearch']]],['^input',[['__set_model',['','searchValue4','$event',[]]]]]]}}" bind:search="__e" bind:input="__e" class="data-v-01e5139b" bind:__l="__l"></search><view class="demo-section data-v-01e5139b"><view class="section-title data-v-01e5139b">禁用状态</view><search bind:input="__e" vue-id="3abde0cb-5" placeholder="禁用状态的搜索框" disabled="{{true}}" value="{{searchValue5}}" data-event-opts="{{[['^input',[['__set_model',['','searchValue5','$event',[]]]]]]}}" class="data-v-01e5139b" bind:__l="__l"></search></view><view class="demo-section data-v-01e5139b"><view class="section-title data-v-01e5139b">不显示取消按钮</view><search vue-id="3abde0cb-6" placeholder="没有取消按钮" showCancel="{{false}}" value="{{searchValue6}}" data-event-opts="{{[['^search',[['onSearch']]],['^input',[['__set_model',['','searchValue6','$event',[]]]]]]}}" bind:search="__e" bind:input="__e" class="data-v-01e5139b" bind:__l="__l"></search></view></view>
|