Anti-fraud-mobile/components/Search/index.vue

<template>
	<view class="Search">
		<u--input v-model="searchVal" placeholder="请输入关键字" suffixIcon="search" suffixIconStyle="font-weight: bold"
			border="none"
			:customStyle="{ height: '88rpx', borderRadius: '20rpx', lineHeight:'88rpx', backgroundColor: '#eee', padding: '0 20rpx 0 40rpx'}"
			:clearable="true" @focus="focusSearch" @confirm="clickSearch" @clear="clickClear">
			<template slot="suffix">
				<u-icon name="search" color="#000" size="60rpx" @click="clickSearch"></u-icon>
			</template>
		</u--input>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				searchVal: ""
			};
		},
		methods: {
			focusSearch() {
				console.log('input聚焦')
				this.jump('/pages/search/index')
			},
			clickSearch() {},
			clickClear() {},
		}
	}
</script>

<style lang="scss" scoped>
	.Search {
		padding: 0 40rpx;
		// margin: 20rpx 0;
	}
</style>