无法绑定到自定义组件的属性

Question

似乎无法绑定到自定义组件中的数据。我已经尝试过 BindUtilis 和 {}，但似乎无法理解。这是我得到的：

我有一个可绑定的类 DataModel

在 Mainn.mxml 我有两个组件：DataGrid（用于测试）和 CustomComponent（扩展 Canvas）

当 DataModel.somelist 中的数据更新时，DataGrid 会反映更改，但 CustomComponent 不会出现。

每当 this._dataModel.itemList 更改时，我希望看到跟踪 (CustomComponent.dataProvider) 被触发。我究竟做错了什么？

Main.mxml 看起来像这样：

<mx:Script>
<![CDATA[
    import model.DataModel;

    [Bindable]
    private var _dataModel:DataModel = DataModel.getInstance();

]]>
</mx:Script>

<mx:VBox width="100%" height="100%">
    <views:ItemDisplayList  width="100%" height="300" id="idl" >
        <views:dataProvider>
            {this._dataModel.itemList}
        </views:dataProvider>
    </views:ItemDisplayList>

    <mx:DataGrid id="dg" width="100%" height="300" >
        <mx:dataProvider>
            {this._dataModel.itemList}
        </mx:dataProvider>
    </mx:DataGrid>
</mx:VBox>

CustomComponent 有这个 AS 类：

package code{

import model.DataModel;
import mx.containers.Canvas;

public class CustomComponent extends Canvas{

    [Bindable]
    private var _dataModel:DataModel = DataModel.getInstance();

    private var _dataProvider:ArrayCollection ;  

    public function CustomComponent(){
        super();
        _dataProvider = new ArrayCollection();
        trace("CustomComponent start");
    }

    public function get dataProvider() : ArrayCollection {
        trace("get dataProvider");
        return _dataProvider;
    }

    public function set dataProvider(value: ArrayCollection) : void {
        trace("set dataProvider");
        this._dataProvider = value;
        invalidateProperties();
        invalidateSize();
        invalidateDisplayList();
        dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE));
   }

   ...


    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number ) : void{
        trace("updateDisplayList");       
        super.updateDisplayList(unscaledWidth, unscaledHeight);         
    }
}
}

Answer 1

您是在自定义组件中重置 dataProvider，还是通过更新来添加/删除 dataModel.itemList 中的项目？

如果您将项目添加到dataModel.itemList，那么您的自定义组件不会更新，但 DataGrid 会。这是因为在 DataGrid 中（也许它在 Flex 中的核心 ListBase 组件中？），当您 set dataProvider 时，它会为 CollectionEvent.COLLECTION_CHANGE 添加一个事件侦听器。当它听到（当您的 ArrayCollection/IList 中的某些内容从删除/添加/刷新/等发生更改时）时，它会运行一些方法来更新 DataGrid 的 itemRenderers。如果您创建自己的 dataProvider 属性，则必须手动编写代码。

如果您在自定义组件 (custom.dataProvider = myArrayCollection) 上显式设置 dataProvider，它将更新。但这不是最有效的做法。我建议扩展一个已经实现 dataProvider 属性的 List 类，这需要解决很多问题。

查看source for the mx ListBase's dataProvider method 看看他们做了什么。

希望对您有所帮助， 兰斯