guyu/components/guyu-home-container/home-search.vue
2025-07-23 23:42:09 +08:00

52 lines
1.1 KiB
Vue

<template>
<view class="home-search">
<view class="search-box">
<image src="@@:static/ic_search.png" class="search-icon" mode=""></image>
<input type="text" placeholder="" class="search-input" disabled @click="onSearchClick" />
</view>
</view>
</template>
<script setup>
/**
* 首页搜索组件
*/
import { defineEmits } from 'vue';
// 事件
const emit = defineEmits(['click']);
// 点击搜索框
const onSearchClick = () => {
emit('click');
};
</script>
<style lang="scss" scoped>
.home-search {
width: 100%;
margin-top: 96.53rpx;
.search-box {
width: 450.56rpx;
height: 71.53rpx;
background-color: #FFFFFF;
border: 5rpx solid #F5D677;
border-radius: 50rpx;
display: flex;
align-items: center;
.search-icon {
width: 28.47rpx;
height: 28.47rpx;
margin-left: 25rpx;
}
.search-input {
flex: 1;
height: 100%;
font-size: 28rpx;
}
}
}
</style>