如何使用Vue.js对象访问其他节点？

Question

所以我通过以下代码获取了以下对象：this.$refs.modal.$el。

但是我想更进一步，得到firstElementChild

但它正在给我一个空节点。

可能是元素尚未创建吗？ 有没有办法等待它？

我发现我可以访问this.$refs.modal.$el.childNodes，但我无法访问this.$refs.modal.$el.childNodes[Ø]这可能是什么意思？

Answer 1

您是否尝试过使用此功能。$ refs.modal。$ el.childNodes.item（0）？

（https://developer.mozilla.org/en-US/docs/Web/API/NodeList/item）

Answer 2

您问题的另一种解决方案是在您的子元素中添加ref属性。

Answer 3

好的问题是该元素尚未在DOM中生成。

所以要听取它，你只需要使用$nextTick

        makeVisible() {
            this.$refs.modal.visible = true
            this.$nextTick(function() {
                if (this.$refs.modal.$el.firstChild.clientHeight > window.innerHeight) {
                    this.$refs.modal.$el.firstChild.style.height = "90%"
                    this.$refs.modal.$el.firstChild.style.overflowY = "scroll"
                }
            })
        },