wxapp/components/search/index.vue
2024-08-03 19:57:17 +08:00

82 lines
1.5 KiB
Vue

<template>
<!-- 搜索框 -->
<view class="search-wrapper">
<view class="index-search" @click="onClick">
<view class="index-cont-search t-c">
<text class="search-icon iconfont icon-sousuo"></text>
<text class="search-text">{{ tips }}</text>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
tips: {
type: String,
default: '搜索关键字'
},
itemStyle: Object,
},
data() {
return {}
},
methods: {
onClick() {
this.$emit('event')
}
}
}
</script>
<style lang="scss" scoped>
.search-wrapper {
padding: 0rpx 10rpx 10rpx 10rpx;
display: block;
position: fixed;
z-index: 999999;
width: 100%;
background: #ffffff;
/* #ifdef H5 */
margin-top: 13rpx;
/* #endif */
}
.index-search {
border-bottom: 0;
background: #fff;
border-radius: 10rpx;
overflow: hidden;
font-size: 28rpx;
color: #6d6d6d;
box-sizing: border-box;
height: 82rpx;
line-height: 82rpx;
border: solid 2rpx #cccccc;
text-align: left;
display: block;
margin-top: 10rpx;
.index-cont-search {
width: 100%;
font-size: 28rpx;
background: #ffffff;
text-align: left;
display: flex;
justify-content: center;
align-items: center;
}
.index-cont-search .search-icon {
font-size: 30rpx;
font-weight: bold;
}
.index-cont-search .search-text {
margin-left: 5rpx;
}
}
</style>