[Component development] a solution for customizing itemrenderer to warn unable to bind to property

Yesterday we encountered this phenomenon: the custom itemrenderer, and then the data type is arraycollection. Once published, the console panel will output a lot of such warning error messages.
Warning: Unable to bind to property 'label' on class 'object' (class is not an ieventdispatcher)
Warning: Unable to bind to property 'icon 'on class 'object' (class is not an ieventdispatcher)

Paste out my custom itemrenderer (simplified ):

1. <? XML version = "1.0" encoding = "UTF-8"?>
   
2. <Mx: vbox xmlns: MX = "http://www.adobe.com/2006/mxml">
   
3. <Mx: Image Source = "{data. Icon}"/>
   
4. <Mx: button label = "{data. Label}"/>
   
5. </MX: vbox>

Copy code

Search online to obtain the following information:
Arraycollection is an enhanced array that uses arrays to store data. However, arraycollection supports sorting and attribute binding, and is suitable for processing complex data.
However, its child elements cannot be bound as data sources.

The solution posted by online and Forum friends is to use the objectproxy class as an intermediate Proxy:
Myarraycollection. Push (New objectproxy ({"label": "flex", "icon": "assets/fl.png "}))
This is actually to block this possible error from the data source, but this practice has a disadvantage that it cannot be applied to tag data in the format of <mx: arraycollection/>.

Modify the custom itemrenderer as follows, so you don't have to worry about anything and everything is OK.

<?xml version="1.0" encoding="utf-8"?><mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"><mx:Script>        <![CDATA[                import mx.binding.utils.BindingUtils;                                [Bindable]                private var _data:Object;                [Bindable]                private var _label:String;                [Bindable]                private var _icon:String;                                override public function set data(value:Object):void{                        _label=value.label;                        _icon=value.icon;                        _data=value;                }                override public function get data():Object{                        return _data;                }        ]]></mx:Script>        <mx:Image source="{_icon}"/>        <mx:Button label="{_label}"/></mx:VBox>

A more direct method:

<?xml version="1.0" encoding="utf-8"?><mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"><mx:Script>        <![CDATA[                [Bindable]                private var _label:String;                [Bindable]                private var _icon:String;                                override public function set data(value:Object):void{                        super.data=value;                       if(data)                       {                              _label=data.label;                              _icon=data.icon;                       }                       else                       {                              _label="";                              _icon="";                       }                }        ]]></mx:Script>        <mx:Image source="{_icon}"/>        <mx:Button label="{_label}"/></mx:VBox>

Reprinted: http://bbs.9ria.com/thread-22017-1-1.html