crm-app-vue3/pages/clueDetail/index.vue

<template>
	<view>
		<u-navbar placeholder :autoBack="true">
			<template slot="center">
				<view class="navbar_center_wrap">
					<text class="name">{{name}}</text>
					<text class="pinyin">{{$chineseToPinYin(name)}}</text>
				</view>
			</template>
		</u-navbar>
		<clueDetail :clueId="clueId" :params="params"></clueDetail>
	</view>
</template>

<script>
import clueDetail from "./page/clueDetail.vue";
	import qs from 'qs';
	export default {
		components: {
			clueDetail
		},
		onPullDownRefresh() {
			uni.stopPullDownRefresh();
			// 刷新
			uni.redirectTo({
				url : `/pages/clueDetail/index?` + qs.stringify(this.params),
			})
		},
		onLoad(option) {
			const {	name , clueId , type } = option;
			this.name = name;
			this.clueId = clueId;
			this.params = option;
			uni.setNavigationBarTitle({
				title: name
			});
		},
		data() {
			return {
				name: "", 
				clueId: "",
				params : {},
			}
		},
		mounted(){
		}
	}
</script>

<style lang="scss" scoped>
	.navbar_center_wrap{
		text-align: center;
		width: 200rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		.pinyin{
			font-size: 22rpx;
			color: #b3b3c6;
		}
	}
</style>