设置Flex中Tree组件默认选中一项

简介: 项目中需要用到tree这个组件,但我在做产品的过程中想让程序默认选中tree组件中的某一节点。之前用到的flex的sdk是3.4版本,在使用selectItem时遇到“术语未定义…”,调试跟踪进去发现在SDK里面报错了,后来换成3.6版本,报错是没报错,可是selectItem设置后一直没反应。

项目中需要用到tree这个组件,但我在做产品的过程中想让程序默认选中tree组件中的某一节点。之前用到的flex的sdk是3.4版本,在使用selectItem时遇到“术语未定义…”,调试跟踪进去发现在SDK里面报错了,后来换成3.6版本,报错是没报错,可是selectItem设置后一直没反应。

 

后来想到的办法是,通过遍历tree的数据源(dataProvider),然后找到指定元素在数据源中的索引值。最后通过设置tree的selectedIndex来解决它,然后调用validateNow()方法进行重绘,这样就达到目的了。

 

伪代码如下:

var idx:Number = -1;
var xml:XML = (tree.dataProvider as XMLListCollection).getItemAt(0) as XML;
var bool:Boolean;

for each (var p:XML in xml.node..@id)
{
idx++;

var parentXML:XML = p.parent() as XML;

if (tId == p.toXMLString() && parentXML.@g != "1")
{
bool = true;
break;
}
}

//todo
 
 
tree的数据源XML(即使通过ID判断的时候,下面也有ID是重复的,但还是有属性g来进行区分),类似如下:
<?xml version="1.0" encoding="UTF-8" ?> 
<node name="root">
<node name="xxx" id="1" g="1">
<node name="xxx" id="4" status="0"/>
<node name="xxx" id="5" status="0"/>
<node name="xxx" id="6" status="0"/>
<node name="xxx" id="7" status="0"/>
</node>
<node name="xxx" id="2" g="1">
<node name="xxx" id="8" status="0"/>
<node name="xxx" id="9" status="0"/>
<node name="xxx" id="10" status="0"/>
<node name="xxx" id="11" status="0"/>
<node name="xxx" id="12" status="0"/>
<node name="xxx" id="13" status="0"/>
</node>
<node name="xxx" id="3" g="1">
<node name="xxx" id="1" status="1"/>
<node name="xxx" id="2" status="1"/>
<node name="xxx" id="3" status="1"/>
</node>
</node>


目录
相关文章
|
开发者 容器
ArkUI框架,Flex布局,基础组件及封装,父子组件的双向绑定
Flex组件用于创建弹性布局,开发者可以通过Flex的接口创建容器组件,进而对容器内的其他元素进行弹性布局,例如:使三个元素在容器内水平居中,垂直等间隔分散。 例如:如下的布局代码分别表示:(垂直排列,水平居中,垂直居中)
515 0
ArkUI框架,Flex布局,基础组件及封装,父子组件的双向绑定
|
4月前
|
开发者 UED 容器
鸿蒙next版开发:ArkTS组件通用属性(Flex布局)
在HarmonyOS next中,ArkTS的Flex布局是一种强大且灵活的布局方式,支持水平或垂直方向排列元素,并能动态调整大小和位置以适应不同屏幕。主要属性包括justifyContent、alignItems、direction和wrap,适用于导航栏、侧边栏和表单等多种场景。示例代码展示了如何使用这些属性创建美观的布局。
212 10
|
5月前
|
数据可视化 前端开发 搜索推荐
FLEX组件可视化设计器CSS3代码生成器
FLEX组件可视化设计器CSS3代码生成器
90 4
|
8月前
|
编解码 前端开发 容器
CSS Flex布局实战案例:构建响应式卡片组件
【7月更文挑战第17天】通过上述步骤,我们成功地使用CSS Flex布局构建了一个响应式的卡片组件。Flexbox不仅简化了布局代码,还让我们能够轻松实现复杂的布局效果,如响应式设计。在实战中,掌握Flexbox将大大提高前端开发的效率和网页布局的质量。希望这个案例能够帮助你更好地理解和应用Flexbox布局。
|
10月前
|
IDE API 开发工具
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Flex容器组件
鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Flex容器组件
255 5
|
10月前
|
容器 API UED
【鸿蒙软件开发】ArkUI之容器组件Counter(计数器组件)、Flex(弹性布局)
【鸿蒙软件开发】ArkUI之容器组件Counter(计数器组件)、Flex(弹性布局)
349 0
【鸿蒙软件开发】ArkUI之容器组件Counter(计数器组件)、Flex(弹性布局)
|
容器
会议OA项目-首页->flex弹性布局,轮播图后台数据获取及组件使用(后台数据交互mockjs),首页布局
会议OA项目-首页->flex弹性布局,轮播图后台数据获取及组件使用(后台数据交互mockjs),首页布局
102 0
|
前端开发 Java 开发工具
Flutter(七)——多子元素组件:GridView,CustomScrollView,Flex,Wrap
Flutter(七)——多子元素组件:GridView,CustomScrollView,Flex,Wrap
386 0
|
开发框架 小程序 开发工具
APICloud AVM框架列表组件list-view的使用、flex布局教程
avm.js 是APICloud 推出的多端开发框架。使用 avm.js 一个技术栈可同时开发 Android & iOS 原生 App、小程序和 iOS 轻 App,且多端渲染效果统一;全新的 App 引擎 3.0 不依赖 webView,提供百分百的原生渲染,保障 App 性能和体验与原生 App 一致。
228 0
APICloud AVM框架列表组件list-view的使用、flex布局教程
好客租房116-flex布局组件导航菜单
好客租房116-flex布局组件导航菜单
127 0
好客租房116-flex布局组件导航菜单