<template> <!-- 搜索框 --> <view class="search-wrapper"> <view class="index-search" @click="onClick"> <view class="index-cont-search t-c"> <text class="search-icon iconfont icon-search"></text> <text class="search-text">{{ tips }}</text> </view> </view> </view> </template> <script> export default { props: { tips: { type: String, default: 'iPhone15' } }, data() { return {} }, methods: { onClick() { this.$emit('event') } } } </script> <style lang="scss" scoped> .search-wrapper { background: #fff; padding: 13rpx; } .index-search { border-bottom: 0; background: #fff; border-radius: 50rpx; overflow: hidden; font-size: 28rpx; color: #6d6d6d; box-sizing: border-box; line-height: 64rpx; display: flex; align-items: center; .index-cont-search { width: 100%; font-size: 28rpx; background: #f7f7f7; display: flex; align-items:center; height: 64rpx; background: #F7F8FA; border-radius: 68rpx 68rpx 68rpx 68rpx; opacity: 1; } .index-cont-search .search-icon { font-size: 28rpx; margin-left: 26rpx; } .index-cont-search .search-text { margin-left: 14rpx; } } </style>