Flex4中绑定JSON数据到DataGrid组件中

在Flex中解析JSON，需要使用corelib包，包的下载地址为：https://github.com/mikechambers/as3corelib

我上传了一份，下载地址为：http://files.cnblogs.com/modou/as3corelib.zip

把解压的as3corelib.swc文件直接复制到flex项目的libs目录即可

 

JSON数据可以从Java等远程页面获取，这里为了简化例子，直接把json字符串放进来：

<?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"  creationComplete= "application1_creationCompleteHandler(event)" >
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    <fx:Script>
        <![CDATA[
            import  com.adobe.serialization.json.JSON;

            import  mx.collections.ArrayCollection;
            import  mx.controls.Alert;
            import  mx.events.FlexEvent;
            import  mx.rpc.events.FaultEvent;
            import  mx.rpc.events.ResultEvent;

            protected  function  application1_creationCompleteHandler(event:FlexEvent): void
            {
                var  jsonData: String  = "[{\"filename\":\"aa.txt\",\"filesize\":\"312kb\"},{\"filename\":\"bb.txt\",\"filesize\":\"212kb\"}]" ;
                var  arr: Array  = (JSON.decode(jsonData) as  Array );
                var  dp:ArrayCollection = new  ArrayCollection(arr);

                grid.dataProvider = dp;
            }
        ]]>
    </fx:Script>
    <fx:Declarations>
    </fx:Declarations>

    <mx:DataGrid id= "grid"  x= "129"  y= "138" >
        <mx:columns>
            <mx:DataGridColumn headerText= "文件名"  dataField= "filename" />
            <mx:DataGridColumn headerText= "文件大小"  dataField= "filesize" />
        </mx:columns>
    </mx:DataGrid>
</s:Application>