异步Loader中SwipeView动态加载时currentIndex异常跳转问题求助

这个问题的核心是异步加载时组件初始化顺序与Repeater动态生成项的时机冲突：

• 当你在SwipeView里直接写currentIndex: 0时，这个赋值会在Repeater开始生成子项前执行，但Repeater是逐个创建并添加子项到SwipeView中的，而SwipeView默认会在新子项添加到末尾时，自动将currentIndex切换为最后一项的索引（也就是4），直接覆盖了你之前设置的0。
• TabBar因为绑定了SwipeView的Repeater model，同样会因为子项逐个添加的过程，导致自身的currentIndex被同步拉到最后一项。

以下是几种可行的修复方式，按推荐程度排序：

1. 延迟设置currentIndex到Repeater生成完成后 #

监听Repeater的count变化，当子项数量等于model总数时，再强制设置currentIndex为0，避免被添加子项的逻辑覆盖：

Loader{
    asynchronous: true
    anchors.fill: parent
    sourceComponent:  ColumnLayout{
        TabBar{
            Layout.fillWidth: true
            currentIndex: swipeView.currentIndex // 双向绑定同步SwipeView
            Repeater{
                model: swRepeater.model
                delegate: TabButton{
                    text: "Tab button "+index
                }
            }
            onCurrentIndexChanged: swipeView.currentIndex = currentIndex
        }

        SwipeView{
            id: swipeView
            Layout.fillWidth: true
            Layout.fillHeight: true
            Repeater{
                id: swRepeater
                model: 5
                delegate: Item{
                    Label{
                        anchors.centerIn: parent
                        text: qsTr("Test "+index)
                    }
                }
                // 当所有子项生成完成后设置currentIndex
                onCountChanged: {
                    if(count === model) {
                        swipeView.currentIndex = 0
                    }
                }
            }
            onCurrentIndexChanged: {
                console.debug("Index was modified to ",currentIndex)
            }
        }
    }
}

2. 在组件加载完成后统一赋值 #

利用Component.onCompleted，等整个ColumnLayout及其内部组件都初始化完成后，再设置currentIndex：

Loader{
    asynchronous: true
    anchors.fill: parent
    sourceComponent:  ColumnLayout{
        Component.onCompleted: swipeView.currentIndex = 0

        TabBar{
            Layout.fillWidth: true
            currentIndex: swipeView.currentIndex
            Repeater{
                model: swRepeater.model
                delegate: TabButton{
                    text: "Tab button "+index
                }
            }
            onCurrentIndexChanged: swipeView.currentIndex = currentIndex
        }

        SwipeView{
            id: swipeView
            Layout.fillWidth: true
            Layout.fillHeight: true
            Repeater{
                id: swRepeater
                model: 5
                delegate: Item{
                    Label{
                        anchors.centerIn: parent
                        text: qsTr("Test "+index)
                    }
                }
            }
            onCurrentIndexChanged: {
                console.debug("Index was modified to ",currentIndex)
            }
        }
    }
}

3. 禁用SwipeView的自动currentIndex切换（进阶） #

如果不想依赖时机判断，可以通过自定义逻辑阻止SwipeView在添加子项时自动切换索引，但这种方式需要额外处理，不如前两种简洁。

• 一定要给TabBar和SwipeView设置双向绑定，确保两者的currentIndex同步，避免出现TabBar和显示内容不匹配的问题。
• 异步Loader的asynchronous: true会让组件加载过程非阻塞，所以内部组件的初始化顺序不是严格的线性，依赖时机的操作必须加监听或延迟触发。

内容的提问来源于stack exchange，提问作者CMGeorge