Função de ciclo de vida do uni-app

Função de ciclo de vida do uni-app

Ciclo de vida do aplicativo App.js

  • onLaunch
    Quando a inicialização do applet for concluída, onLaunch será acionado (apenas acionado uma vez globalmente)
  • onShow
    Quando o applet inicia, ou entra na tela de primeiro plano a partir do plano de fundo, onShow será acionado
  • onHide
    Quando o applet entrar em segundo plano a partir do primeiro plano, onHide será acionado
  • onError
    Quando ocorre um erro de script no applet, ou a chamada da API falha, o onError será acionado com uma mensagem de erro
<script>
	export default {
    
    
		onLaunch: function() {
    
    
			console.log('App Launch')
		},
		onShow: function() {
    
    
			console.log('App Show')
		},
		onHide: function() {
    
    
			console.log('App Hide')
		},
		onError:function(err){
    
    
			console.log("err",err);
		}
	}
</script>

Funções de ciclo de vida em páginas

  • onLoad é
    acionado quando a página é carregada
  • onReady
    escuta a conclusão da renderização inicial da página (a página carrega primeiro - display - última renderização)

  • exibição da página do monitor onShow
  • onHide
    escuta a ocultação de página (ao alternar para o plano de fundo, acione o onHide da página primeiro e, em seguida, oculte o onHide do aplicativo)
  • onUnload
    monitora o descarregamento da página (ou seja, é acionado ao pular de uma página para outra)
<template>
	<view>
		我是msg
		<view class="dom" ref="domRef" >
			我是dom
		</view>
		<son v-if="flag"></son>
		<button type="default" @click="btn">我是btn</button>
	</view>
</template>

<script>
	import son from "./childCom/son.vue"
	export default {
    
    
		components:{
    
    
			son
		},
		data(){
    
    
			return {
    
    
				flag:true
			}
		},
		methods: {
    
    
			onLoad(){
    
    
				console.log("页面加载",this.$refs.domRef); // 页面加载 undefined 01
			},
			onReady(){
    
    
				console.log("页面dom节点加载完毕",this.$refs.domRef); // 页面dom节点加载完毕 相关dom
			},
			onShow(){
    
    
				console.log("onShow-监听页面显示");// onShow-监听页面显示 02
			},
			onHide(){
    
    
				console.log("onHide-监听页面隐藏");// onHide-监听页面隐藏 切换路由的时候,会隐藏当前组件
			},
			onUnload(){
    
    
				console.log("onUnload-监听页面卸载");// onUnload-监听页面卸载 切换路由的时候,会隐藏当前组件
			},
			btn(){
    
    
				this.flag = !this.flag;
			}
		}
	}
</script>

<style lang="scss">

</style>

Acho que você gosta

Origin blog.csdn.net/weixin_43845137/article/details/123976987
Recomendado
Clasificación