Question

我正在通过学习Flex来破解我的方式并且发现了一些奇怪的行为。当我尝试编译我的代码时，我抛出了这个错误 - 错误：调用可能未定义的方法updateStory。我之前以这种方式使用了方法调用，并且在这种情况下无法发现出错的地方。这是组件的代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">

  <mx:Script>
    <![CDATA[

    import mx.collections.ArrayCollection;

    [Bindable]
    public var storyCards:ArrayCollection;

    private function updateStory():void
    {
       trace("success");
    }   

    ]]>
  </mx:Script>

  <mx:TileList dataProvider="{storyCards}" >

    <mx:itemRenderer>

      <mx:Component>

    <mx:HBox>
      <mx:Label />
      <mx:TextInput keyUp="updateStory()" />
      <mx:TextArea text="{data.notes}" />
    </mx:HBox>

      </mx:Component>

    </mx:itemRenderer>

  </mx:TileList>
</mx:Canvas>

有人能指出我正确的方向吗？

Answer 1

问题在于mx：Component父标记。

来自the docs:

＆lt; mx：组件＆gt;标签定义了一个新的 MXML文件中的范围，其中项呈示器的本地范围或项目编辑器由MXML定义代码块由。分隔＆LT;的 MX：组件＆GT;和＆lt; / mx：组件＆gt; 标签。访问以外的元素项呈示器的本地范围或项目编辑器，您为元素添加前缀使用outerDocument关键字命名。

所以你需要公开'updateStory'并添加outerdocument关键字，如下所示：

<?xml version="1.0" encoding="utf-8"?> <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"> <mx:Script> <![CDATA[ import mx.collections.ArrayCollection; [Bindable] public var storyCards:ArrayCollection; public function updateStory():void { trace("success"); } ]]> </mx:Script> <mx:TileList dataProvider="{storyCards}" > <mx:itemRenderer> <mx:Component> <mx:HBox> <mx:Label /> <mx:TextInput keyUp="outerDocument.updateStory()" /> <mx:TextArea text="{data.notes}" /> </mx:HBox> </mx:Component> </mx:itemRenderer> </mx:TileList> </mx:Canvas>

Answer 2

您还可以从ItemRenderer组件调度一个Event，并在主文档中添加一个Listener。如果您想将ItemRenderer组件移植到单独的MXML组件文件，这将非常有用。

这是您的代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:Script>
        <![CDATA[

        import mx.collections.ArrayCollection;

        [Bindable]
        public var storyCards:ArrayCollection;

        private function updateStory():void
        {
           trace("success");
        }       

        ]]>
  </mx:Script>

  <mx:TileList dataProvider="{storyCards}" myEvent="updateStory();">

        <mx:itemRenderer>

          <mx:Component>
            <mx:Metadata>
                [Event(name="myEvent", type="flash.events.Event")]
            </mx:Metadata>

        <mx:HBox>
          <mx:Label />
          <mx:TextInput keyUp="dispatchEvent(new Event('myEvent', true))" />
          <mx:TextArea text="{data.notes}" />
        </mx:HBox>

          </mx:Component>

        </mx:itemRenderer>

  </mx:TileList>
</mx:Canvas>

以下是在单独的MXML组件中使用它的方法：

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:Script>
        <![CDATA[

        import mx.collections.ArrayCollection;

        [Bindable]
        public var storyCards:ArrayCollection;

        private function updateStory():void
        {
           trace("success");
        }       

        ]]>
  </mx:Script>

  <mx:TileList dataProvider="{storyCards}" myEvent="updateStory();" itemRenderer="StoryEditor" />
</mx:Canvas>

StoryEditor.mxml:

<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Metadata>
        [Event(name="myEvent", type="flash.events.Event")]
    </mx:Metadata>

    <mx:Label />

    <mx:TextInput keyUp="dispatchEvent(new Event('myEvent', true));" />

    <mx:TextArea text="{data.notes}" />
</mx:HBox>

这是在mxml中调用组件方法的正确方法

2 个答案: