如何从函数外部访问TabView内部的QML元素

How to access QML elements inside TabView from the function outside?

本文关键字：内部 QML 元素 TabView 访问 函数 外部      更新时间：2023-09-26

在我的QML应用程序中，我有一个TabView、Tabs以及一些按钮和文本字段。我需要使用TabView组件外部的自定义功能来访问它们，该组件由选项卡内部的按钮调用

我的代码很简单：

ApplicationWindow {
    function showText() {
        console.log(tabView.testText);
    }
    TabView {
        id: tabView
        property alias testText: test.text
        Tab {
            title:'tab1'
            RowLayout {
                Button {
                    text:"PRINT"
                    onClicked: {
                        showText()
                    }
                }
                Text {
                    id:test
                    text:'Test123'
                }
            }
        }
        Tab {
            title:'tab2'
        }
    }
}

但我收到了别名创建行的错误消息：

 Invalid alias reference. Unable to find id "test"

它怎么了？我在SO（qt快速控制选项卡视图中的ReferenceError）上也遇到了类似的问题，但代码也不起作用。

我认为您应该再添加一个这样的别名：

TabView {
    id: tabView
    property var testText: { return getTab(0).tab1Text }
    Tab {
        id: tab1
        title:'tab1'
        property alias tab1Text: test.text
        RowLayout {
            Button {
                text:"PRINT"
                onClicked: {
                    showText()
                }
            }
            Text {
                id:test
                text:'Test123'
            }
        }
    }
    Tab {
        title:'tab2'
    }
}

如本答案中所述，Tab基本上是Loader，这意味着您试图通过别名访问的属性可能尚未加载。alias有一些严格的要求，其中之一是它们"只有在组件完全初始化后才会激活":

由于您从试图访问的Tab中调用show()方法，因此您可以直接传递所需的数据：

import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Extras 1.3
import QtQuick.Layouts 1.1
ApplicationWindow {
    width: 300
    height: 600
    visible: true
    function showText(text) {
        console.log(text)
    }
    TabView {
        id: tabView
        Tab {
            title: 'tab1'
            RowLayout {
                Button {
                    text: "PRINT"
                    onClicked: {
                        showText(text)
                    }
                }
                Text {
                    id: test
                    text: 'Test123'
                }
            }
        }
        Tab {
            title: 'tab2'
        }
    }
}
相关文章：