当我搜索项目时，Flex DropDown 选择不起作用

Question

所以这是我目前遇到的问题。我试图简化我的代码，以便我可以尝试解决这个问题，但我绝对没有运气。我有一个视图堆栈，每个堆栈包含 1 个下拉列表。它们共享相同的数据提供者。我想要做的是从第一个中选择项目内容。一旦我这样做了，当我单击下一个堆栈的按钮时，我有一个从索引 0 搜索到 dataprovider 长度的函数，如果第一个堆栈中的项目与第二个匹配，我想让第二个下拉列表选择那个项目起来并显示它。我让它匹配，我尝试选择它，但是当我运行应用程序时，它显示为没有选择任何内容。这是我所拥有的：

编辑：我让它用于一个简单的示例，但是当我尝试在更复杂的示例中使用它时，由于某种原因在该按钮上单击它会将 selectedIndex 的值重置为 -1。我该如何防止这种情况发生？这是简单示例的工作代码

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" applicationComplete="popList()">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>


<fx:Script>
    <![CDATA[
        import mx.collections.ArrayCollection;
        import mx.controls.Alert;
        [Bindable]
        private var myList : ArrayCollection;

        [Bindable]
        private var selectedItem : String;

        [Bindable]
        private var index : int;

        [Bindable]
        private var ind : int;

        private function popList() : void {
            myList = new ArrayCollection();
            stack.initialize();
            myList.addItem("1");
            myList.addItem("2");
            myList.addItem("3");
            myList.addItem("4");
            myList.addItem("5");
            myList.addItem("6");
            first.initialize();
            second.initialize();
        }

        private function goNext() : void {
            selectedItem = first.selectedItem;
            stack.selectedChild = stackb;

            for(index = 0; index < myList.length; index++){
                var itemNow : String = myList[index].toString();
                if(selectedItem == myList[index].toString()){
                    ind = index;
                }
            }

        }

    ]]>
</fx:Script>
<mx:ViewStack id="stack" width="862" height="500">
    <s:NavigatorContent id="stacka">
        <s:DropDownList x="317" y="174" id="first" dataProvider="{myList}"></s:DropDownList>
        <s:Button id="next" x="335" y="263" label="Next" click="goNext()"/>
    </s:NavigatorContent>
    <s:NavigatorContent id="stackb">
        <s:DropDownList x="317" y="174" id="second" dataProvider="{myList}" selectedIndex="{ind}"></s:DropDownList>
    </s:NavigatorContent>
</mx:ViewStack>



</s:Application>

Answer 1

我没有尝试运行代码，但我有一堆观察结果：

1. 首先，不要对两个单独的 DropDownList 使用相同的 dataProvider。它会导致奇怪的问题。这毫无意义，我不知道为什么；但确实如此。您可以通过使用相同的源创建第二个集合来欺骗 dataProvider。像这样：

-

second.dataProvider = new ArrayCollection(myList.source);

1. 其次，您不必手动调用任一 DropDownLists 上的初始化方法。这是非常不寻常的。初始化事件作为创建过程的一部分被触发；我假设初始化方法是默认事件处理程序的一部分。但是，触发该事件与让组件完成其生命周期过程不同。

2. ViewStack 不会在视图更改之前初始化它的子项。因此，您可能会在初始化 DropDownList 之前在第二个 DropDownList 上设置 selectedIndex，这可能会导致该下拉列表丢失。您可以通过在 ViewStack 上将 creationPolicy 设置为 all 来解决此问题。

3. 您可能可以通过绑定解决此问题。像这样的东西。

-

<s:DropDownList x="317" y="174" id="second" dataProvider="{myList}" selectedIndex="{first.selectedIndex}"></s:DropDownList>

1. 您选择下一个项目的代码是将一个对象与一个字符串进行比较，因此您将选择 selectedItem。

你可以把你的循环改成这样：

        for(index = 0; index < myList.length; index++){
            if(selectedItem == myList[index]){
                second.selectedIndex = index;
            }
        }

1. 但是，如果您使用的是同一个 dataProvider 或它的副本，为什么还需要循环呢？只需使用 selectedIndex 属性：

-

second.selectedIndex = first.selectedIndex 

这有帮助吗？

注意：StackOverflow 使得在列表中进行代码格式化变得非常困难；很抱歉没有在我的列表中保留这些数字。