从外部 AS 访问 MXML 中定义的元素

Posted 2023-04-18

技术标签:

【中文标题】从外部 AS 访问 MXML 中定义的元素【英文标题】：Access to elements defined in MXML from External AS 【发布时间】：2010-10-09 08:58:01 【问题描述】：

我有一个带有表单的 MXML，其中有两个 TextInput。我讨厌在 MXML 文件中包含任何代码（我来自 javascript 格式），所以我使用了

mx:Script source="external.as"

标记以包含任何 MXML 文件中使用的任何代码。问题是，如果我在external.as 文件中有此代码：

private function populateFromForm():void
   var vo:ValidObject= new ValidObject();
   vo.market = marketInput.text;
   vo.segment = segmentInput.text;
   vo.priceLow = priceLowInput.text;
   vo.priceHigh = priceHighInput.text;

其中 marketInput、segmentInput、priceLowInput 和 priceHighInput 是在 MXML 文件中定义的 TextInput。当我尝试编译时，我得到一个 1120: Access to undefined property XXXXX

我尝试在函数之前添加以下行：

public var marketInput:TextInput;
public var segmentInput:TextInput;
public var priceLowInput:TextInput;
public var priceHighInput:TextInput;

但是我得到一个 1151:A conflict exists with definition XXXX in namespace internal，这很有意义。

有没有办法做到这一点，而不必将所有输入引用作为函数的参数传递给函数？

【问题讨论】：

你能把mxml文件贴出来吗？ 【参考方案1】：

您需要创建对 TextInputs 父容器实例的引用，然后使用该引用来访问 TextInputs 及其属性。我认为我们需要对您的文件结构进行一些澄清。您如何创建父容器的实例？我想这是你需要做的：

MyForm.mxml：

<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:TextInput id="marketInput" />
    <mx:TextInput id="segmentInput" />
    <mx:TextInput id="priceLowInput" />
    <mx:TextInput id="priceHighInput" />
</mx:VBox>

SaveVOContainer.as：

package

    public class SaveVoContainer extends Container
    
        private var myForm:MyForm = new MyForm();

        public function SaveVOContainer
        
            this.addChild(myForm);
        

        private function populateFromForm():void
           var vo:ValidObject= new ValidObject();
           vo.market = myForm.marketInput.text;
           vo.segment = myForm.segmentInput.text;
           vo.priceLow = myForm.priceLowInput.text;
           vo.priceHigh = myForm.priceHighInput.text;

【讨论】：

【参考方案2】：

在 Flex 中执行“代码隐藏”很痛苦。没有部分类的概念或 Javascript 中原型继承的灵活性。 Google 为许多资源提供“flex 中的代码隐藏”。

我认为你最好习惯在 mxml 中嵌入代码的想法。使用脚本标签尽可能避免内联代码。如果您必须在 MXML 中编写大量代码，也许您可能希望将代码重构为多个自定义组件。可重复使用的奖励积分。

【讨论】：

非常感谢，我刚刚做到了。我只是不同意“痛苦”的形容词，我发现它实际上非常干净且易于理解（您通常会惊呼“..它是如此明显，我不敢相信我自己没有找到它！”）【参考方案3】：

在 Flex 中执行代码隐藏的规范方法是通过继承。这是来自文档的一个很好的解释：http://learn.adobe.com/wiki/display/Flex/Code+Behind。简而言之：

声明一个 ActionScript 类以用作您的基类。将基类设置为 MXML 文件中的根容器。对于在 MXML 文件中声明的任何控件，您必须使用完全相同的名称将它们重新声明为基类的公共成员（正如您在上面为带有源标记的脚本块所做的那样，只有它有效 :-)

那么，你的 ActionScript 文件：

package mypackage

    import mx.controls.TextInput;

    public class myClass extends WindowedApplication
    
        public var marketInput:TextInput;

        private function populateFromForm():void
            /* As above */

以及对应的MXML文件：

<?xml version="1.0" encoding="utf-8"?>
<custom:myClass xmlns:custom="mypackage.*"
        xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx">
    <mx:TextInput id="marketInput"/>
</custom:myClass>

您的其他 TextInput 控件等等。现在你的 populateFromForm 函数应该可以工作了。

不得不两次重新声明相同的实体有点令人发指，但这并不是之前的受访者所说的伤害袋子（尽管这可能在 Flex 4 中进行了更改以减轻痛苦)。

【讨论】：

【参考方案4】：

在 .AS 中导入：

import mx.core.Application;

在 .AS 中使用这个：

mx.core.Application.application.component.property = value; mx.core.Application.application.myText.text = 'test';

【讨论】：

【参考方案5】：

您的 mxml 文件中是否有指向 ActionScript 文件的脚本标记？