hldy_app_mini/pages/NursingNew/component/pleasetake/takehome.vue

<template>
	<view class="index-content-other" :style="transition?{opacity: `1`}:{opacity: `0`}">
		<view class="right-container-title-nav">
			<text style="margin-left: 30rpx;">
				NUID：{{ uni.getStorageSync('nuId')}}
			</text>
			<text class="new-weight">
				{{ uni.getStorageSync('nuName')}}
			</text>
			<view class="right-icons">
				<image class="right-icons-img" src="/static/index/requestform/touxiang.png" />
				<view>{{uni.getStorageSync('realname')}}</view>
				<image class="right-icons-img-back" src="/static/index/requestform/back.png" v-if="hometype>0" @click="hometype=0" />
				<view  v-if="hometype>0" @click="hometype=0">返回</view>
			</view>
		</view>
		<takehomep v-if="!hometype" @changePageNumber="changehometype" ></takehomep>
		<!-- v-if是实际隐藏，isshow是控制动画 -->
		<requestformView :isShow="hometype==1" />
	</view>
</template>

<script setup lang="ts">
	import { ref, onMounted, onBeforeUnmount, computed, nextTick,  watch, reactive } from 'vue';
	import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
	import { queryCgdList } from '@/pages/Warehouse/api/lunpan.js'
	import requestformView from './component/requestform.vue'
	import takehomep from './component/takehomep.vue'
	const hometype = ref(0)
	const transition = ref(false);
	const props = defineProps({
		isShow: {
			type: Boolean,
			required: true,
		},
	});
	watch(
		() => props.isShow,
		(newVal, oldVal) => {
			// 当旧值为false，新值为true时延迟0.2秒调用方法
			if (!oldVal && newVal) {
				transition.value = false;
				setTimeout(() => {
					transition.value = true;
				}, 50)
			} else {
				transition.value = false;
			}
	
		}
	)
	const changehometype = (index:number) => {
		hometype.value = index
	}
</script>

<style scoped lang="scss">
	@import "./css/take.less";
	.index-content-other {
		width: calc(100% - 260rpx);
		// background-color: red;
		height: 100%;
		transition: opacity 1s ease;
		position: relative;
	}
</style>