1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859 |
- <template>
- <view class="searchWrapper">
- <view class="searchView d-flex a-center">
- <input type="text" v-model="searchText" placeholder="搜索"/>
- <view class="icon iconfont icon-search-1-copy" @tap="search"></view>
- </view>
- </view>
- </template>
- <script>
- export default{
- data(){
- return {
- searchText:""
- }
- },
- methods:{
- search(){
- if(this.searchText=='' ||this.searchText==null ){
- uni.showToast({
- icon:"none",
- title:"请输入搜索内容",
- duration:1500
- })
- return;
- }
- this.$emit('search',this.searchText)
- }
- }
- }
- </script>
- <style scoped>
- /* 搜索框区域Start */
- .searchWrapper {
- width: 100%;
- padding: 15upx 20upx;
- margin: 0 auto;;
- box-sizing: border-box;
- }
- .searchView {
- border: 1px solid #ccc;
- background: #fff;
- height: 75upx;
- border-radius: 40upx;
- font-size: 30upx;
- color: #C0C0C0;
- padding: 0 40upx;
- box-sizing: border-box;
- }
- .searchView input{
- padding-left: 10upx;
- width:100%;
- }
- .searchView .icon{
- font-size: 40upx;
- }
- /* 搜索框区域End */
- </style>
|