一、效果

 点击tab键，可以切换焦点

二、代码

CusTInput.qml


import QtQuick 2.0

// 必须使用FocusScope，才能外部使用自定义组件时，转发焦点
FocusScope {

    // alias: used to export properties
    property alias title: title.text
    property alias content: tinput.text
    property alias recWidth: rec.width
    property alias recHeight: rec.height
    // export complete component
    property alias input: tinput

    id: cusinput
    implicitWidth: title.width + 20 + rec.widthNAvi
    implicitHeight: rec.height
    Text {
        id: title
        font.pixelSize: 20
        text: qsTr("输入行:")
    }

    Rectangle {
        id: rec
        anchors.verticalCenter: title.verticalCenter
        anchors.left: title.right
        anchors.leftMargin: 20
        width: 200
        height: 30
        border.color: "black"

        TextInput {
            id: tinput
            anchors.fill: parent
            focus: true
            font.pixelSize: 20
            // equal height between top and bottom
            verticalAlignment: Qt.AlignVCenter
            //            horizontalAlignment: Qt.AlignHCenter
            text: "input 01"
        }
    }
}

main.qml


import QtQuick 2.15
import QtQuick.Window 2.15

Window {
    width: 640
    height: 480
    visible: true

    
    Item {
        width: 400
        height: 200
        Column {
            anchors.fill: parent
            spacing: 50

            CusTInput {
                id: input01
                title: "默认配置:"
                // 不需要 alias property,直接调用！
                KeyNavigation.tab: input02
            }

            CusTInput {
                id: input02
                title: "自选配置:"
                KeyNavigation.tab: input01
            }
        }
    }

}

三、注意事项