<template> <view class="nav-content"> <view class="nav"><view class="log" v-if="navtype" @tap="clickOrder"></view><view class="nav-sech"><view class="secah">CAN</view><view class="input-nav" @tap="test">{{ placeholder }}</view></view></view> </view> </template> <script> export default { data() { return { searchText: '', //搜索内容 placeholder: '请输入航班号或行李号' } }, props:{ navname:{ type:String, default:'' }, navtype:{ type:Boolean, default:true }, navtypes:{ type:Boolean, default:false } }, created(option) { }, onLoad(){ }, onUnload() { }, onShow() { }, mounted() { }, methods: { test(){ uni.redirectTo({ url: "/pages/search/index" }) }, //搜索框输入事件 inputSearch() { this.$emit('input', this.searchText) }, clickOrder () { this.$emit('fall') } }, } </script> <style lang="scss" scoped> .nav-content{ >.nav{ width: 100%; height: 2.375rem; display: flex; justify-content: center; align-items: center; padding-top: 2.25rem; color: rgb(255, 255, 255); font-family: Noto Sans SC; font-size: 1rem; position: relative; // background: rgba(234, 241, 245,0.2); >.log{ width: .375rem; height: .75rem; font-size: .75rem; position: absolute; left: 1.5rem; background: url('../../static/ico.png') no-repeat; background-size: 100% 100%; } >.nav-sech{ width: 18.5625rem; height: 1.875rem; display: flex; align-items: center; background: rgba(234, 241, 245,0.2); border-radius:4px; .secah{ width: 3.75rem; height: 80%; display: flex; align-items: center; justify-content: center; color: rgb(255, 255, 255); font-family: Noto Sans SC; font-size: 14px; font-weight: 400; border-right: .0625rem solid rgb(255, 255, 255); } .my-input-placeholder{ color: rgb(170, 195, 207); } .input-nav{ padding-left: .625rem; color: rgb(170, 195, 207); } } >.up{ position: absolute; right: 1.5rem; color: rgb(255, 255, 255); font-family: Noto Sans SC; font-size: .875rem; font-weight: 500; } } } </style>