Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
FMLLL opened this issue Sep 11, 2024 · 3 comments
Assignees
Labels
stale: closed Closed due to stale stale: 30d No interaction in the last 30 days

Comments

@FMLLL
Copy link

FMLLL commented Sep 11, 2024

描述错误
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
Copy link

+1

Copy link

hippy-service bot commented Nov 11, 2024

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.

@hippy-service hippy-service bot added the stale: 30d No interaction in the last 30 days label Nov 11, 2024
Copy link

hippy-service bot commented Dec 11, 2024

Sorry, closing this issue because it has stalled for over 3 months.
Feel free to reopen if this issue is still relevant, or to ping the collaborator if you have any questions.

@hippy-service hippy-service bot added the stale: closed Closed due to stale label Dec 11, 2024
@hippy-service hippy-service bot closed this as not planned Won't fix, can't repro, duplicate, stale Dec 11, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
stale: closed Closed due to stale stale: 30d No interaction in the last 30 days
Projects
None yet
Development

No branches or pull requests

3 participants