FLEX实践:在程序中遍历FORMITEM

本文介绍了一段用于清空Flex应用中FORMITEM组件内所有控件数据的代码实现。该方法通过遍历FORMITEM中的子元素并针对不同类型的控件进行相应的数据清除操作。

FLEX中有时会用到FORM这种CONTAINER,代码如下

<mx:Form>

<mx:FormItem>

<mx:TextInput/>

</mx:FormItem>

<mx:FormItem>

<mx:TextArea/>

</mx:FormItem>

<mx:FormItem>

<mx:CheckBox/>

</mx:FormItem>

<mx:FormItem>

<mx:DateField/>

</mx:FormItem>

</mx:Form>

现在我要通过一段代码将FORMITEM中的所有控件的数据清空。

以下是实现代码

private function clearRow():void{
var formItems:Array=lookupValueForm.getChildren();
for each(var formitem:* in formItems){
if(formitem is FormItem){
for each(var it:* in formitem.getChildren()){
if(it is mx.controls.TextInput|| it is mx.controls.TextArea){
it.text="";
} else if(it is mx.controls.CheckBox){
it.selected=false;
}else if(it is mx.controls.DateField){
it.selectedDate=null;
}
}
}

}
}

注:本代码的关键是要了解FORMITEM中具体用到了哪些类型的控件及每种控件的数据应该如何被清空。

<el-segmented v-model="valueL" :options="optionsL"> <template #default="scope"> <el-popover ref="popoverRef" placement="bottom-end" :width="568" trigger="manual" v-model:visible="showFilterPopover" :hide-after="0" :show-arrow="false" popper-class="demand-filter-popover" virtual-triggering :reference-el="buttonRef" @hide="onPopoverHide" > <template #reference> <div class="flex items-center gap-2 p-2"> <Icon :size="14" icon="svg-icon:filter" :style="{ color: scope.item.value === valueL ? '#fff' : '#333' }" /> <div>筛选</div> </div> </template> <!-- 筛选内容 --> <div class="filter-popover-content" style="height: 249px" @click.stop> <!-- 关闭按钮 --> <div class="popover-close-btn" @click="showFilterPopover = false"> <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" > <path d="M9 3L3 9M3 3L9 9" stroke="#999999" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /> </svg> </div> <el-form ref="filterFormRef" :model="filterForm" label-width="100px" class="filter-form" label-position="top" > <!-- 第一行 --> <div class="filter-form-row"> <div class="filter-form-item"> <el-form-item label="提出部门"> <el-select v-model="filterForm.proposerDepartments" multiple filterable placeholder="请输入" clearable collapse-tags style="width: 200px" :teleported="false" @click.stop > <el-option v-for="dept in departmentOptions" :key="dept.value" :label="dept.label" :value="dept.value" /> </el-select> </el-form-item> </div> <div class="filter-form-item"> <el-form-item label="涉及系统"> <el-select v-model="filterForm.involvedSystems" multiple filterable placeholder="请输入" clearable collapse-tags style="width: 200px" :teleported="false" @click.stop > <el-option v-for="system in systemOptions" :key="system.value" :label="system.label" :value="system.value" /> </el-select> </el-form-item> </div> <div class="filter-form-item"> <el-form-item label="产品经理"> <el-select v-model="filterForm.productManagers" multiple filterable placeholder="请输入" clearable collapse-tags style="width: 200px" :teleported="false" @click.stop > <el-option v-for="manager in productManagerOptions" :key="manager.value" :label="manager.label" :value="manager.value" /> </el-select> </el-form-item> </div> </div> <!-- 第二行 --> <div class="filter-form-row"> <div class="filter-form-item"> <el-form-item label="项目名称"> <el-select v-model="filterForm.projectNames" multiple filterable placeholder="请选择" clearable collapse-tags style="width: 200px" :teleported="false" @click.stop > <el-option v-for="project in projectOptions" :key="project.value" :label="project.label" :value="project.value" /> </el-select> </el-form-item> </div> <div class="filter-form-item"> <el-form-item label="项目分级"> <el-select v-model="filterForm.projectLevels" multiple placeholder="请选择" clearable collapse-tags style="width: 200px" :teleported="false" @click.stop > <el-option v-for="level in levelOptions" :key="level.value" :label="level.label" :value="level.value" /> </el-select> </el-form-item> </div> </div> </el-form> <!-- 按钮区域 --> <div class="filter-buttons"> <el-button type="info" @click="handleReset">重置</el-button> <el-button type="primary" @click="handleQuery">查询</el-button> </div> </div> </el-popover> <div :key="scope.item.value" class="flex items-center gap-2 p-2" :ref="scope.item.value === '1' ? buttonRef : null" > <Icon :size="14" :icon="scope.item.icon" :style="{ color: scope.item.value === valueL ? '#fff' : '#333' }" /> <div>排序</div> </div> <div :key="scope.item.value" class="flex items-center gap-2 p-2" :ref="scope.item.value === '1' ? buttonRef : null" > <Icon :size="14" :icon="scope.item.icon" :style="{ color: scope.item.value === valueL ? '#fff' : '#333' }" /> <div>导出</div> </div> </template> </el-segmented>不以遍历的形式,将所需元素单独写在组件内
11-28
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值