sap.m.Panel:使整个标题可点击 [英] sap.m.Panel: make entire header clickable
本文介绍了sap.m.Panel:使整个标题可点击的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有 sap.m.Panel 并且我想在用户单击标题的地方启用展开/折叠.但是这个事件只在用户点击箭头时触发.
I have sap.m.Panel and I want to enable expand / collapse where the user click on the header. But this event only fires when the user clicks on the arrow.
知道如何解决吗?
这是我的代码:
var panel = new Panel(); // Panel required from "sap/m/Panel"
panel.setExpandable(true);
panel.setHeaderText("someText");
推荐答案
UI5 ≥ 1.79
从 1.79 开始，sap.m.Panel 的整个标题默认是可点击的.1
UI5 ≥ 1.79
Since 1.79, the entire header of sap.m.Panel is clickable by default.1
添加 headerToolbar 并将其 active 属性设置为 true.在按下时，使用 panel.setExpanded(!panel.getExpanded()) 切换 expanded 属性值:
Add a headerToolbar and set its active property to true. On press, toggle the expanded property value with panel.setExpanded(!panel.getExpanded()):
sap.ui.getCore().attachInit(() => sap.ui.require([
"sap/m/Panel",
"sap/m/Toolbar",
"sap/m/Title",
"sap/m/Text",
], (Panel, Toolbar, Title, Text) => {
const panel = new Panel({
expandable: true,
headerToolbar: new Toolbar({
active: true,
content: new Title({ text: "Panel Header" }),
press: () => panel.setExpanded(!panel.getExpanded()),
}),
content: new Text({ text: "Panel content" }),
}).placeAt("content");
}));<script id="sap-ui-bootstrap"
src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-libs="sap.ui.core, sap.m"
data-sap-ui-async="true"
data-sap-ui-theme="sap_fiori_3"
data-sap-xx-waitfortheme="init"
></script>
<body id="content" class="sapUiBody"></body>1 提交:d8741f3/a>
这篇关于sap.m.Panel:使整个标题可点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
