onReady和onLoad与onShow的区别.md

在 uni-app 开发 微信小程序 时，onLoad、onReady 和 onShow 是页面生命周期的常见钩子函数，它们各自有不同的触发时机和使用场景。下面是这些生命周期钩子函数的详细比较及其使用场景：

触发时机：onLoad 会在页面加载时触发，通常在页面的实例化之后、页面渲染之前。它是页面初始化的第一个生命周期函数，传入的参数是通过页面的路由跳转传递的。
使用场景：
用于初始化页面的数据，通常会在此函数中进行 API 请求、页面数据的初始化等操作。
onLoad 会在页面加载时调用，因此适用于需要初始化页面状态、接收参数、设置页面初始数据的情况。

示例：

export default {
  onLoad(options) {
    // 页面加载时执行
    console.log('Page loaded with options:', options);
  }
}

在小程序中，onLoad 函数会接收一个 options 参数，它包含了页面跳转时传递的参数。

触发时机：onReady 会在页面首次渲染完成后触发。也就是说，当页面的视图和 DOM 结构已经渲染完成，用户可以看到页面内容时，onReady 会被触发。通常是在页面首次显示时执行一次。
使用场景：
用于执行一些页面加载完成后的操作，如页面的动态渲染、动画效果初始化、第三方组件的加载等。
适合需要依赖页面渲染完成后的操作，比如获取页面元素的尺寸、执行动画等。

示例：

export default {
  onReady() {
    // 页面渲染完成时执行
    console.log('Page is ready');
  }
}

这里 onReady 会在页面的 DOM 和视图内容已经渲染完毕，用户可以看到完整页面后被调用。

触发时机：onShow 会在页面每次显示时触发。这不仅仅是在页面首次加载时，而是在页面每次从后台切换到前台时都会被触发。它会在 onLoad 和 onReady 之后触发，并且每次页面切换回来时都会被触发。
使用场景：
用于每次页面显示时需要执行的操作，比如刷新数据、检查登录状态、更新页面内容等。
适合用于监听页面的可见状态，确保在每次页面展示时执行一些动态更新操作。

示例：

export default {
  onShow() {
    // 页面每次显示时执行
    console.log('Page is shown');
  }
}

onShow 也可以用于检测页面是否需要更新内容，或检测小程序的生命周期变化。

通过合理利用这些生命周期函数，可以有效地管理页面的加载、渲染和显示流程，提高小程序的用户体验和性能。