--------------------------------------------–

上个月，淘客推广平台，我的导师Jerry希望我探索UI5诊断。我的第一感觉就是这个博客的标题。通常情况下，这么草率地选一个题目不太好。但是著名作家村上春树有一本书叫《当我谈论跑步时我谈论什么》。然后我觉得很放松。：D关于UI5诊断我想先谈谈袖珍刀。

我的第一把袖珍刀是我高中毕业时阿姨送给我的礼物。她问我："你在大学学什么？"。我觉得电信对她来说可能有点难理解，所以我回答说："我学了一些关于计算机的知识。"。然后她给了我一把"网络工具"小刀。这把刀有许多螺丝刀。对我阿姨来说，云服务器购买，"关于电脑的东西"意味着修理电脑。

之后我又买了一些小刀。但我最喜欢的是"侍者"刀。它只有几个功能，但对我来说已经足够了。我最常用的是主刀。

我去年学的UI5。当时我发现UI5诊断非常类似于小刀。这么多功能，很好用。对我来说，"控制树"是小刀的主刀。

关于控制树

这里我们有一个小例子，页面中有一个sap.m.文本。按Shift+Ctrl+Alt+s我们可以打开UI5诊断。然后点击控制树中的"文本"节点，

所有属性都在右侧，您可以对其进行修改，并在相应的set/get函数中添加断点。（断点是如何插入的？请阅读杰瑞的博客）您可以看到控件的绑定信息可以在控件的所有函数中添加断点控件高亮显示一秒钟

属性列表从何而来？

让我们在中的代码行229上添加一个断点事件提供程序.js. 它可以帮助我们在sap/ui/core/support/plugins中找到函数"getControlProperties"/控制树.js. 我们知道所有控件都是从元素派生的。在这里我们可以找到一个"while"循环。这就是为什么所有的属性都被分成不同的"基类型"。

在"while"循环中，所有的属性都被重新组织，在函数"renderProperties tab"中，它们将被呈现到DOM中。

属性是如何改变的？

在属性列表中，数据和大数据，我们可以更改属性。我认为最后一步必须是sap.m.Text中的函数"setText"。所以我在这里加了一个断点。在调用堆栈中，我找到了函数onsapUiSupportControlTreeChangeProperty。原来在元数据中，所有属性都有set/get函数的名称。

绿色突出显示非常难看，大数据技术及数据分析培训，好评返现，但我想探索一下：D

让我们继续在EventProvider中尝试。然后我们可以在中的apuissupportselector或highlight上找到函数选择器.js. 事实证明，"突出显示"不是控件的标准行为。但实际上是一个绿色的"面具"（div）。

面具的大小是由文本的高度和宽度决定的。它会把遮罩准确地放在文本的位置上。这就是为什么它看起来像"文本突出显示"。

在控件树中找到控件

如果页面太复杂，在控件树中很难找到控件。但幸运的是，我们可以用Ctrl+Alt+Shift+鼠标点击来完成它。

如果UI5 Diagnostics是打开的，则有一个额外的"鼠标按下"事件处理程序。它是\fSelectHandler in选择器.js. 当所有三个修改键都被按下时，相应的控制节点被选中。