uniapp生命周期onResize怎么使用

uniApp 的 `onResize` 是一个生命周期钩子，它会在窗口大小发生改变时触发。这个方法通常用于处理视口尺寸的变化，以便适应不同的设备屏幕尺寸或窗口模式。你可以在需要响应页面布局变化的地方设置 `onResize`，例如调整图片大小、重置滚动位置等。

下面是一个简单的例子：

Page({
  data: {
    initialWidth: window.innerWidth,
  },
  onReady() {
    // 页面加载完成后的回调
  },
  onResize(newWidth) { // 新的窗口宽度
    console.log('窗口大小改变：', newWidth);
    this.setData({
      width: Math.min(window.innerWidth, window.innerHeight), // 保持宽高一致
    });
    
    // 这里可以编写针对新尺寸的自适应逻辑，如调整组件样式或结构
  },
  onShow() {
    // 页面显示时的回调
  },
  onHide() {
    // 页面隐藏时的回调
  },
})

在这个例子中，当 `window.innerWidth` 发生变化时，`onResize` 会被调用，并更新组件的状态以反映新的屏幕大小。

相关问题

uniapp生命周期每秒

uniapp生命周期是指在一个uniapp应用中，每个页面都有一系列的生命周期函数，用于控制页面的初始化、渲染、数据更新等过程。uniapp的生命周期包括以下几个：

1. onLaunch：应用初始化时触发，只触发一次。

2. onShow：应用启动或从后台进入前台时触发。

3. onHide：应用从前台进入后台时触发。

4. onError：应用发生错误时触发。

5. onPageNotFound：页面不存在时触发。

对于每个页面，还有以下生命周期函数：

1. onLoad：页面加载时触发。

2. onShow：页面显示时触发，每次打开页面都会触发。

3. onReady：页面初次渲染完成时触发。

4. onHide：页面隐藏时触发。

5. onUnload：页面卸载时触发。

6. onPullDownRefresh：用户下拉刷新时触发。

7. onReachBottom：页面上拉触底时触发。

8. onShareAppMessage：用户点击分享按钮时触发。

9. onPageScroll：页面滚动时触发。

10. onResize：页面尺寸变化时触发。

11. onTabItemTap：用户点击tab时触发。

以上是uniapp常用的生命周期函数，每个函数的触发频率取决于具体的用户操作和应用逻辑，不是固定的每秒触发一次。

uniapp 页面生命周期

UniApp的页面生命周期包括一系列的生命周期钩子函数，用于在页面的不同阶段执行相应的操作。以下是UniApp中常用的页面生命周期钩子函数：

1. onLoad：页面加载时触发，可以在此函数中进行一些初始化操作。
2. onShow：页面显示时触发，每次页面显示都会执行此函数，可以在此函数中进行数据刷新等操作。
3. onReady：页面初次渲染完成时触发，可以在此函数中进行一些视图操作。
4. onHide：页面隐藏时触发，可以在此函数中进行一些清理工作或保存数据等操作。
5. onUnload：页面卸载时触发，可以在此函数中进行一些清理工作或保存数据等操作。
6. onPullDownRefresh：下拉刷新时触发，可以在此函数中执行下拉刷新相关的操作。
7. onReachBottom：上拉触底时触发，可以在此函数中执行上拉加载更多的操作。
8. onShareAppMessage：点击分享按钮时触发，可以在此函数中定义分享的内容和行为。
9. onPageScroll：页面滚动时触发，可以在此函数中处理页面滚动相关的逻辑。

除了以上常用的生命周期钩子函数，还有其他一些钩子函数用于处理特定场景下的操作，例如onTabItemTap（当点击底部tab栏时触发）和onResize（当页面尺寸变化时触发）等。

通过使用这些生命周期钩子函数，您可以在不同的阶段执行相应的操作，实现页面的初始化、数据更新、清理和交互等功能。