NervJS / taro

开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5/React Native 等应用。 https://taro.zone/
https://docs.taro.zone/
Other
35.36k stars 4.77k forks source link

el.getBoundingClientRect is not a function #13970

Closed fangbicheng closed 1 year ago

fangbicheng commented 1 year ago

相关平台

微信小程序

小程序基础库: Taro3 使用框架: React

复现步骤

const el = document.getElementById('#inner') const res = await el.getBoundingClientRect()

期望结果

有值

实际结果

undefined

环境信息

Taro v3.5.12

ctxOptions---- { type: undefined }

  Taro CLI 3.5.12 environment info:
    System:
      OS: macOS 11.5.2
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 14.16.0 - ~/.nvm/versions/node/v14.16.0/bin/node
      Yarn: 1.16.0 - /usr/local/bin/yarn
      npm: 6.14.11 - ~/.nvm/versions/node/v14.16.0/bin/npm
    npmPackages:
      @tarojs/cli: 3.5.12 => 3.5.12 
      @tarojs/components: 3.5.12 => 3.5.12 
      @tarojs/helper: 3.5.12 => 3.5.12 
      @tarojs/plugin-framework-react: 3.5.12 => 3.5.12 
      @tarojs/plugin-platform-alipay: 3.5.12 => 3.5.12 
      @tarojs/plugin-platform-jd: 3.5.12 => 3.5.12 
      @tarojs/plugin-platform-qq: 3.5.12 => 3.5.12 
      @tarojs/plugin-platform-swan: 3.5.12 => 3.5.12 
      @tarojs/plugin-platform-tt: 3.5.12 => 3.5.12 
      @tarojs/plugin-platform-weapp: 3.5.12 => 3.5.12 
      @tarojs/react: 3.5.12 => 3.5.12 
      @tarojs/router: 3.5.12 => 3.5.12 
      @tarojs/runtime: 3.5.12 => 3.5.12 
      @tarojs/shared: 3.5.12 => 3.5.12 
      @tarojs/taro: 3.5.12 => 3.5.12 
      @tarojs/webpack5-runner: 3.5.12 => 3.5.12 
      babel-preset-taro: 3.5.12 => 3.5.12 
      eslint-config-taro: 3.5.12 => 3.5.12 
      react: ^18.0.0 => 18.2.0 
      taro-ui: ^3.0.0-alpha.10 => 3.0.0-alpha.10 
Chen-jj commented 1 year ago

@fangbicheng 小程序里不能这样写,请参考文档:https://docs.taro.zone/docs/ref#%E8%8E%B7%E5%8F%96%E8%8A%82%E7%82%B9%E5%B0%BA%E5%AF%B8%E4%BF%A1%E6%81%AF

TheKonka commented 1 year ago

https://developers.weixin.qq.com/miniprogram/dev/api/wxml/NodesRef.boundingClientRect.html 建议参考小程序文档里面的示例代码

或者像我这样封装

image