Flex的樹沒有節點得到適當選擇

Question

的Flex SDK 4.1

我使用MX：樹組件來加載一個靜態的XML數據，使之在樹的形式。我有一個HDivided框，我的左側部分將有樹，右側的主要部分將是一個帶有Flex IFrame組件的邊框容器。

在creationComplete事件上，我使用靜態xml數據爲Tree組件分配了數據提供者。該樹將加載xml數據。如果我在樹中選擇了任何特定的葉節點，右邊部分（即邊框容器內的IFrame）應該加載與所選節點數據對應的html內容。沒有問題。

問題我已經是後我加載撓曲模塊，

步驟1：

而不選擇任何頂部的節點，我選擇（單擊）E.下節點E1對應的HTML內容平穩加載。

步驟2：

然後，如果我選擇下d分支節點D2，D2的選擇是不會發生並且它與E1本身保持。很顯然，itemClick處理程序將選擇的項目作爲E1，並再次加載相同的E1內容。

選擇不會更改爲D2。

相反，如果我選擇除D2之外的其他節點，如D1，C1，C2等，節點的選擇會發生變化，並且相應節點的HTML內容會被正確加載。

爲什麼選擇不會改變？樹中的最後一個節點是否有問題？

的test.xml

<root> 

    <A label="A"> 
     <menu label="A1" /> 
     <menu label="A2" /> 
     <menu label="A3" /> 
     <menu label="A4" /> 
    </A> 
    <B label="B"> 
     <menu label="B1" /> 
     <menu label="B2" /> 
     <menu label="B3" /> 
    </B> 
    <C label="C"> 
     <menu label="C1" /> 
     <menu label="C2" /> 
     <menu label="C3" /> 
    </C> 
    <D label="D"> 
     <menu label="D1" /> 
     <menu label="D2" /> 
    </D> 
    <E label="E"> 
     <menu label="E1" /> 
    </E> 

</root> 

FxTree.mxml（Application容器）

<?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" 
       width="100%" height="100%" 
       creationComplete="onCreationComplete(event)"> 
    <s:layout> 
     <s:VerticalLayout/> 
    </s:layout> 
    <fx:Declarations> 
     <fx:XML id="xmldata" source="/xml/test.xml"/> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 
      import mx.collections.XMLListCollection; 
      import mx.controls.Alert; 
      import mx.events.FlexEvent; 
      import mx.events.ListEvent; 

      [Embed('/assets/icons/branch.png')] 
      public const branchIcon:Class; 

      [Embed('/assets/icons/nobranch.png')] 
      public const nobranchIcon:Class; 

      [Embed('/assets/icons/chart.png')] 
      public const chartIcon:Class; 

      [Bindable] 
      private var treeData:XMLListCollection; 

      /** 
      * Function for setting the node icons 
      * of 'systemdashboardTree' 
      */ 
      private function setTreeIcon(item:Object):Class { 
       var iconClass:Class; 
       var classType:String = XML(item).attribute("icon"); 
       if(classType!="") 
        return this[classType]; 
       else 
        return null; 
      } 

      /** 
      * Function called on 'creationComplete' event 
      * for feeding data to 'systemdashboardTree' 
      */ 
      protected function onCreationComplete(event:FlexEvent):void 
      { 
       treeData = new XMLListCollection(new XMLList(xmldata)); 
       fxTree.dataProvider = treeData; 
      } 

      /** 
      * Function which handles the systemdashboardTree's 
      * itemDoubleClick event 
      */ 
      protected function onItemDoubleClick(event:ListEvent):void 
      { 
       var item:Object = Tree(event.currentTarget).selectedItem; 
       if (fxTree.dataDescriptor.isBranch(item)) { 
        fxTree.expandItem(item, !fxTree.isItemOpen(item), true); 
       } 
      } 

      /** 
      * Function for loading the selected dashboard 
      */ 
      private function loadDashboard(event:ListEvent):void { 
       var item:Object = event.currentTarget.selectedItem; 
       Alert.show(item.@label); 
      } 
     ]]> 
    </fx:Script> 



    <s:Panel height="100%" 
      width="100%" 
      title="FxTree" 
      borderColor="#CCCCCC"> 
     <mx:HDividedBox height="100%" width="100%"> 
      <s:BorderContainer height="100%" width="20%" borderColor="#CCCCCC"> 

       <s:layout> 
        <s:VerticalLayout/> 
       </s:layout> 

       <mx:Tree id="fxTree" 
         width="100%" height="100%" 
         labelField="@label" 
         showRoot="false" 
         allowMultipleSelection="false" 
         doubleClickEnabled="true" 
         itemClick="loadDashboard(event)"      
         itemDoubleClick="onItemDoubleClick(event)" 
         borderSkin="{null}"/> 
      </s:BorderContainer> 

      <s:BorderContainer id="dashboardContainer" height="100%" width="80%" borderColor="#CCCCCC" /> 

     </mx:HDividedBox> 
    </s:Panel> 

</s:Application> 

這是我在我的應用程序使用的實際代碼。

TestModule.mxml

<?xml version="1.0" encoding="utf-8"?> 
<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" layout="absolute" width="100%" height="100%"> 
    <fx:Declarations> 

     <fx:XML id="data" source="/xml/Test.xml"/> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 
      import mx.collections.XMLListCollection; 
      import mx.events.FlexEvent; 

      [Bindable] 
      private var treeData:XMLListCollection; 

     ]]> 
    </fx:Script> 

     <mx:Tree id="trendsTree" 
       width="50%" height="50%" 
       labelField="@label" 
       dataProvider="{data}" 
       horizontalCenter="0" verticalCenter="0" 
       showRoot="false"/> 
</mx:Module> 

的test.xml

<root> 

    <A label="A"> 
     <menu label="A1" /> 
     <menu label="A2" /> 
     <menu label="A3" /> 
     <menu label="A4" /> 
    </A> 
    <B label="B"> 
     <menu label="B1" /> 
     <menu label="B2" /> 
     <menu label="B3" /> 
    </B> 
    <C label="C"> 
     <menu label="C1" /> 
     <menu label="C2" /> 
     <menu label="C3" /> 
    </C> 
    <D label="D"> 
     <menu label="D1" /> 
     <menu label="D2" /> 
    </D> 
    <E label="E"> 
     <menu label="E1" /> 
    </E> 

</root> 

Answer 1

我是新來的Flex，發現this和this文章由彼得·耳鼻喉科予以明確和柔性樹木非常豐富。在第二個鏈接中，您想要閱讀樹拖放第1部分這是在博客的底部，並且樹拖放第2部分這是在博客的中間。這些回答了我所有關於拖放的問題。祝你好運，快樂的編碼！