我面临着一个问题,与CollapsePanel。
当事件被触发时,我需要更改它的标题。到目前为止,我覆盖了BorderLayout的createCollapsePanel,并向我需要的事件添加了一个侦听器:
final BorderLayout layout = new BorderLayout()
{
@Override
protected CollapsePanel createCollapsePanel(final ContentPanel panel, final BorderLayoutData data)
{
final CollapsePanel result = super.createCollapsePanel(panel, data);
panel.getHeader().addListener(Events.Change, new Listener<BaseEvent>()
{
@Override
public void handleEvent(BaseEvent be)
{
result.setTitle(panel.getHeading());
result.repaint();
layout();
}
});
result.setTitle(panel.getHeading());
return result;
}
};
上面的代码执行得很好,但是结果CollapsePanel永远不会获得新标题。
我是不是遗漏了什么?谢谢
final BorderLayout layout = new BorderLayout()
{
@Override
protected CollapsePanel createCollapsePanel(final ContentPanel panel, final BorderLayoutData data)
{
final CollapsePanel result = super.createCollapsePanel(panel, data);
result.sinkEvents(Events.Change.getEventCode());
panel.getHeader().addListener(Events.Change, new Listener<BaseEvent>()
{
@Override
public void handleEvent(BaseEvent be)
{
result.getElement().getElementsByTagName("span").getItem(0).setInnerText(panel.getHeading());
PcTreeUI.this.layout(true);
}
});
result.setTitle(panel.getHeading());
return result;
}
};
您可能需要取消您正在收听的事件。。。
result.sinkEvents(Events.Change);
(我切换到gxt3,它做的有点不同,所以我没有测试那一行。我不确定你是否需要事件。更改还是事件。OnChange)
介绍 将一组内容放置在多个折叠面板中,点击面板的标题可以展开或收缩其内容。 引入 import { createApp } from 'vue'; import { Collapse, CollapseItem } from 'vant'; const app = createApp(); app.use(Collapse); app.use(CollapseItem); 代码演示 基础用法
折叠面板从二级列表中演化而来,dom结构和二级列表类似,如下: <ul class="mui-table-view"> <li class="mui-table-view-cell mui-collapse"> <a class="mui-navigate-right" href="#">面板1</a> <div class
Collapse 折叠面板 平台差异说明 App H5 微信小程序 支付宝小程序 百度小程序 头条小程序 QQ小程序 √ √ √ √ √ √ √ 基本使用 默认为手风琴模式,即打开一个,另外所有的都会关闭。可以将u-collapse的accordion设置为false,这样可以允许打开多个面板 <template> <u-collapse> <u-collapse-item :title="
通过折叠面板收纳内容区域 基础用法 可同时展开多个面板,面板之间不影响 demo <el-collapse v-model="activeNames" @change="handleChange"> <el-collapse-item title="一致性 Consistency" name="1"> <div>与现实生活一致:与现实生活的流程、逻辑保持一致,遵循用户习惯的语言和概念;
基础用法 可同时展开多个面板,面板之间不影响 :::demo render() { const activeName = "1"; return ( <Collapse value={activeName}> <Collapse.Item title="一致性 Consistency" name="1"> <div>与现实生活一致:与现实生活的流程、
通过折叠面板收纳内容区域 基础用法 可同时展开多个面板,面板之间不影响 [model] 接受一个初始化的数组, 数组中的每一项与 el-collapse-item 的属性 [value] 相对应。 <!-- 可以指定 [(model)] 或 (modelChange) 来获取每次改变的值--> <el-collapse [model]="['1']" notes=" "> <el-collap