uniapp之boundingClientRect注意事项

1.页面中使用

uni.createSelectorQuery().select(`#${id}`).boundingClientRect(res => {
    console.log('=====res====', res)     
}).exec()

2.组件中使用增加 in(this) 或使用 this.createSel.....

uni.createSelectorQuery().in(this).select(`#${id}`).boundingClientRect(res => {
    console.log('=====res====', res)     
}).exec()
this.createSelectorQuery().select(`#${id}`).boundingClientRect(res => {
    console.log('=====res====', res)     
}).exec()

 3.其他写法

uni.createSelectorQuery().select(`#${id}`).boundingClientRect().exec(res => {
  console.log('======res======', res[0])
})

4.boundingClientRect返回值为null

   1.确保页面已经渲染完成再计算高度,即已存在该id标识的元素,常见解决办法是 增加定时器延迟100ms,或在onLoad中去调用。

   2.对view动态设置id时,确保id首位是字母,千万不能是数字,否则wx小程序无法识别。

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
当使用 Uniapp 开发 App 时,以下是一些需要注意的事项: 1. 跨平台适配:Uniapp 允许你使用一套代码同时开发多个平台的 App,如微信小程序、H5、App 等。但是需要注意不同平台的差异性,确保你的代码在各个平台上都能正常运行和展示。 2. 组件选择:Uniapp 提供了一些跨平台的组件,但并不是所有平台都支持所有组件。在选择组件时,要查看文档,了解组件在目标平台上的兼容性和限制。 3. 性能优化:App 的性能对用户体验至关重要。要注意减少不必要的请求、优化图片资源、减少页面渲染等方面来提高 App 的性能。 4. 适配不同屏幕尺寸:App 会在各种不同尺寸的设备上运行,要确保你的布局和样式能够适配不同的屏幕尺寸和分辨率。 5. 使用插件:Uniapp 提供了插件市场,可以使用各种插件来增加 App 的功能和特性。但是要注意选择可靠的插件,并且仔细查看插件文档和示例以确保正确使用。 6. 调试和测试:在开发过程中,及时进行调试和测试是非常重要的。Uniapp 提供了一些调试工具和模拟器,可以帮助你快速定位和解决问题。 7. 安全性考虑:App 的安全性是一个重要的问题。要注意保护用户的隐私数据,避免使用不安全的网络请求方式,以及对用户输入进行合理的验证和过滤。 8. 及时更新:Uniapp 是一个活跃的开源项目,会不断更新和改进。要及时关注 Uniapp 的更新和发布版本,并根据需要进行升级和迁移。 以上是一些开发 Uniapp App 需要注意的事项,希望对你有帮助!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值