自定义flex组件使用标签方式添加子组件

一般情况下,当我们写了一个继承自flex组件并往里面添加了子组件,然后想用标签等方式添加子组件时候报错了,那如何解决这一的问题,自定义组件代码如下:


<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"

width="400" height="300">

<mx:Metadata>

[DefaultProperty("children")]

</mx:Metadata>

<mx:Script>

<![CDATA[

private var _children:Array = [];

private var _childrenChanged:Boolean = false;

public function set children(value:*):void

{

if(value is DisplayObject)

_children = [value];

else

_children = value;

_childrenChanged = true;

invalidateProperties();

}

public function get children():Array

{

return _children;

}

protected override function commitProperties():void

{

super.commitProperties();

if(_childrenChanged)

{

for each(var child:DisplayObject in _children)

{

contentBox.addChild(child);

}

}

}

]]>

</mx:Script>

<mx:Canvas id="contentBox"

width="100%"

height="100%"/>

</mx:Canvas>

时间: 2024-10-08 20:17:44

自定义flex组件使用标签方式添加子组件的相关文章

ExtJs--04--window窗口属性说明并两种方式添加子组件

Ext.onReady(function(){ /** extjs 容器组件的layout属性可以设置它的显示风格,以下视情况选用: - Auto - **默认** - hbox //水平方向排列 - vbox //垂直方向排列 1)absolute:在容器内部,根据指定的坐标定位显示. 2)accordion:手风琴效果. 3)anchor: 注意以下几点: 1.容器内的组件要么指定宽度,要么在anchor中同时指定高/宽 2.anchor值通常只能为负值(指非百分比值),正值没有意义. 3.

ExtJs window(三)添加子组件,查找组件

一.通过items添加子组件 1.new Ext.button.Button创建组件:2.也可以通过通过别名xtype创建组件 二.查找组件 1.组件都有up,down方法,表示向上.向下查找,需要参数为组件xtype或者选择器  alert(btn.up('window').title); 2.最常用的查找方式 alert(Ext.getCmp('mywin').title); Ext.onReady(function(){ //在组件上,添加子组件:并进行针对组件的查找等操作 //通过ite

ExtJS 组件添加子组件

[1 添加子组件]  Ext.onReady(function(){ //ex002 : 在组件中添加子组件  ,并进行一系列针对于组件的操作 //在组件中添加子组件: /*var win = new Ext.window.Window({ title:"添加子组件实例" ,  width:'40%' , height:400 ,  renderTo:Ext.getBody() , draggable:false ,  //不允许拖拽 resizable:false ,  //不允许改

Vue最常用的组件通讯有三种:父-&gt;子组件通讯、子-&gt;父组件通讯,兄弟组件通讯.(template用的pug模板语法)

Vue最常用的组件通讯有三种:父->子组件通讯.子->父组件通讯,兄弟组件通讯.(template用的pug模板语法) 1.父->子组件通讯 父->子组件通讯,是通过props进行数据传递,并且具有这几个特性,单向传递,子组件接收的数据不可以更改,如果更改,会发出警告,每次父组件更新时,子组件的所有 prop 都会更新为最新值. 1 父组件 2 <template lang="pug"> 3 .father 4 Children(:name='msg

vue--父组件向子组件传参--父组件定义v-bind:参数名--子组件接收props----子组件调用父组件的方法(子组件向父组件传参)父组件@事件名称--子组件接收this.$emit

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con

Vue 组件&amp;组件之间的通信 之 子组件向父组件传值

子组件向父组件传值:子组件通过$.emit()方法以事件形式向父组件发送消息传值: 使用步骤: 定义组件:现有自定义组件com-a.com-b,com-a是com-b的父组件: 准备获取数据:父组件com-a要获取子组件data中的height属性: 在子组件com-b中,需要用$.emit()方法将数据以事件的形式发送,$.emit('sendData', data, data…),红色的部分事件名可自定义,数据可传递多个: 在父组件中使用子组件的地方 <com-b @自定义事件名='getD

父组件给子组件传值,并在子组件里面渲染该数据

用@Component({}) 方式引入子组件JobHeader,dom结构如下: <!-- v-if="allImg.length > 0 " allImg 里面有数组了,再渲染子组件 JobHeader --> <JobHeader ref="jobHeader" v-if=" allImg && allImg.length > 0 " :data="allImg">&l

Vue父组件向子组件传递方法(自定义方法)并且子组件向父组件传递数据

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con

vue父组件异步传递prop到子组件echarts画图问题踩坑总结

效果图: 大致思路:考虑到5张图都是折线图,所以准备用一个子组件承接echarts画图,然后父组件通过prop传递不同数据来展示不同的图 踩坑问题: 1.引入line子组件,画了5个元素,但是只显示一个 原因:id重复 解决方案:prop传递不同id名 2.父组件传递的数据在子组件报错 这里情况比较特殊,我用父组件数据data里面给demo数据的时候,子组件是拿得到数据的,图片正常显示,所以以为可以了,当换成从后台请求的数据后,发现子组件总是报错,data.count is not a func