uni-app android端bindingx的getComputedStyle方法异常

uni-app android端bindingx的getComputedStyle方法异常

开发环境 版本号 项目创建方式
Mac 12.3.1 HBuilderX 
### 示例代码：

```vue
<template>  
    <view>  
        <view style="width: 300rpx;height: 300rpx;border: 1px solid red;" ref="test"><text>test</text></view>  
    </view>  
</template>  

<script>  
const bindingx = uni.requireNativePlugin('bindingx');  
export default {  
    data() {  
        return {};  
    },  
    async onLoad() {  
        await this.$nextTick();  
        setTimeout(() => {  
            const data = bindingx.getComputedStyle(this.getEl(this.$refs.test));  
            console.log('test', JSON.stringify(data));  
        }, 300);  
    },  
    methods: {  
        getEl(el) {  
            if (typeof el === 'string' || typeof el === 'number') return el;  
            if (WXEnvironment) {  
                return el.ref;  
            } else {  
                return el instanceof HTMLElement ? el : el.$el;  
            }  
        }  
    }  
};  
</script>

操作步骤：

  • 调用getComputedStyle

预期结果：

  • 得到视图属性

实际结果：

  • 未得到

bug描述：

android端使用bindingx的getComputedStyle方法异常


更多关于uni-app android端bindingx的getComputedStyle方法异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

HX3.4.8+版本已修复该问题

更多关于uni-app android端bindingx的getComputedStyle方法异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html


顶一下，有人么？

老师好,有人,可是我不会

3.4.8.20220428-alpha 已修复，测试OK

在使用 UniApp 开发 Android 应用时，如果你遇到 bindingx 的 getComputedStyle 方法异常，可能是由于以下原因导致的。以下是一些常见的排查和解决方法：

1. 检查 UniApp 和 BindingX 的版本兼容性

  • 确保你使用的 UniApp 和 BindingX 版本是兼容的。不同版本的 UniApp 可能对 BindingX 的支持有所不同。
  • 可以尝试升级或降级 UniApp 和 BindingX 的版本，看看问题是否解决。

2. 检查 getComputedStyle 的使用方式

  • getComputedStyle 是用于获取元素的计算样式的方法。确保你传入的参数是正确的。
  • 示例代码：
    const element = document.getElementById('myElement');
const style = bindingx.getComputedStyle(element);
console.log(style);
  • 确保 element 是一个有效的 DOM 元素。

3. 检查是否在正确的生命周期中调用

  • 确保你在组件的 mounted 或 ready 生命周期中调用 getComputedStyle，以确保 DOM 元素已经渲染完成。
  • 示例：
    export default {
  mounted() {
    this.$nextTick(() => {
      const element = document.getElementById('myElement');
      const style = bindingx.getComputedStyle(element);
      console.log(style);
    });
  }
};

4. 检查 Android 平台的兼容性

  • bindingx 在某些 Android 设备或系统版本上可能存在兼容性问题。可以尝试在其他设备上运行，看看问题是否依然存在。
  • 如果问题仅出现在某些设备上，可能是设备本身的兼容性问题。

5. 调试和日志输出

  • 在调用 getComputedStyle 之前，打印相关元素和参数，确保它们是正确的。
  • 示例：
    const element = document.getElementById('myElement');
console.log('Element:', element);
const style = bindingx.getComputedStyle(element);
console.log('Computed Style:', style);

6. 检查 BindingX 的初始化

  • 确保 BindingX 已经正确初始化。可以在调用 getComputedStyle 之前，检查 BindingX 是否可用。
  • 示例：
    if (typeof bindingx !== 'undefined') {
  const style = bindingx.getComputedStyle(element);
  console.log(style);
} else {
  console.error('BindingX is not available');
}

7. 查看官方文档和社区

  • 查阅 UniApp 和 BindingX 的官方文档，确认 getComputedStyle 的使用方法和限制。
  • 在 UniApp 或 BindingX 的社区中搜索相关问题，看看是否有其他开发者遇到类似问题。

8. 替代方案

  • 如果 getComputedStyle 无法正常工作，可以考虑使用原生 JavaScript 的 window.getComputedStyle 方法作为替代。
  • 示例：
    const element = document.getElementById('myElement');
const style = window.getComputedStyle(element);
console.log(style);
回到顶部