È questo il modo corretto di chiamare un metodo componente all'interno di mxml
-
07-07-2019 - |
Domanda
Mi sto facendo strada attraverso l'apprendimento di Flex e ho trovato comportamenti strani. Quando provo a compilare il mio codice, viene generato questo errore - Errore: chiamata a un metodo forse non definito updateStory. Ho usato le chiamate di metodo in questo modo prima e non riesco a individuare ciò che non va in questo caso. Ecco il codice per il componente:
<?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>
Qualcuno può indicarmi la giusta direzione?
Soluzione
il problema è con il tag mx: Component parent.
da i documenti:
Il < mx: Component > tag definisce un nuovo ambito all'interno di un file MXML, dove il file ambito locale del renderer di elementi o l'editor degli elementi è definito da MXML blocco di codice delimitato da lt; mx &: & Componente gt; e < / mx: Componente > tag. Per accedere agli elementi all'esterno di l'ambito locale del renderer di elementi o editor di elementi, si antepone l'elemento nome con la parola chiave externalDocument.
Quindi devi rendere pubblico 'updateStory' e aggiungere la parola chiave outerdocument, in questo modo:
<?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>
Altri suggerimenti
È inoltre possibile inviare un evento dal componente ItemRenderer e aggiungere un listener nel documento principale. Ciò è utile se si desidera trasferire il componente ItemRenderer in un file componente MXML separato.
Eccolo con il tuo codice:
<?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>
Ecco come lo useresti in un componente MXML separato:
<?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>