Tencent / Hippy

Hippy is designed to easily build cross-platform dynamic apps. 👏
https://hippyjs.org
Apache License 2.0
8.01k stars 946 forks source link

measureInAppWindow和getBoundingClientRect获取循环组件的尺寸和位置信息失败 #4023

Open FMLLL opened 2 months ago

FMLLL commented 2 months ago

描述错误 measureInAppWindow和getBoundingClientRect获取循环组件的尺寸和位置信息失败。循环组件及外层加了对应的collapsable属性也是报错,而去掉v-for循环则能够正常返回

返回错误信息如下: 获取item元素信息失败 Error: getBoundingClientRect cannot get nodeId of ElementNode(div) or ElementNode(div) is not mounted at eval (webpack-internal:///./node_modules/@hippy/vue/dist/index.js:12211:23) at new Promise () at Object.getBoundingClientRect (webpack-internal:///./node_modules/@hippy/vue/dist/index.js:12209:12) at eval (webpack-internal:///./node_modules/babel-loader/lib/index.js?!./node_modules/@hippy/vue-loader/lib/index.js?!./node_modules/scope-loader/index.js!./src/pages/second.vue?vue&type=script&lang=js&:27:58) at TimerModule.js:4:36

预期行为 针对循环组件的元素,调用measureInAppWindow和getBoundingClientRect能正常返回对应的尺寸和位置信息。

版本 -Hippy原生SDK版本:3.3.0 -前端SDK和版本[@hippy/vue 2]

<template>
    <div class="page" :collapsable="false">
        <div
            class="item"
            :key="item"
            :collapsable="false"
            :ref="`item-${item}`"
            v-for="item in list"
        >
            <span>{{ item }}</span>
        </div>
    </div>
</template>
<script>
import Vue from "vue";

export default {
    data() {
        return {
            list: [1],
        };
    },
    mounted() {
        setTimeout(() => {
            Vue.Native.getBoundingClientRect(this.$refs[`item-1`])
                .then((data) => {
                    console.log("获取item元素信息成功", data);
                })
                .catch((err) => {
                    console.log(`获取item元素信息失败`, err);
                });
        }, 3000);
    },
};
</script>

<style scoped>
.page {
    width: 750;
    height: 300;
    flex-direction: row;
}
.item {
    padding-left: 50;
    padding-right: 50;
    height: 30;
    color: #fff;
    background-color: #0a9eed;
}
</style>
villiamVIX commented 2 months ago

+1

hippy-service[bot] commented 5 days ago

Pay attention 🛎️ !! There has been no activity on this issue for 2 months, so I will label it stalled. It will be automatically closed in 60 days if no more activity. Feel free to leave a comment if you have any questions.