SAP UI5 sap.m.Select 控件值无缘无故被修改的问题分析

有朋友在我的知识星球里提问，关于本文介绍的 sap.m.Select 的一个问题：

SAP UI5中的 sap.m.select 控件，在当前页面做任何操作时，都可以选中 key值，但触发 dialog 之后，可以看到 select 框内的 key 值被清空，当关闭 dialog后，再去选择 key 值，无任何反应，请问是 select 控件的问题还是 dialog 的问题又或者是 odata 写法有问题，谢谢！

我的分析和解答

正常情况下，Select 和 Dialog 是两个完全独立的 SAP UI5 控件，二者不可能对彼此的数据显示有任何影响。

然而有一种情况，可以出现这位朋友遇到的这个问题，即因为 SAP UI5 数据双向绑定机制，使得 Dialog 对话框打开时，间接地修改了 Select 控件绑定的模型的数据源。

简而言之，Select 控件绑定到了数据模型 A 的 a 字段。Dialog 的 open 或者 close 函数实现里，由于某种原因，修改了模型 A 的 a 字段，就会出现这个朋友描述的比较奇怪的现象出现。

Dialog 的事件函数处理只是引起问题的可能原因之一，在 OData 读取请求的 onSuccess 或者 onError 等回调函数处理里，如果修改了数据模型A 的 a 字段，也会引起这个问题。

我在本教程的 95_A 文件夹里，创建了一个 SAP UI5 应用来模拟这个问题。进入文件夹 95_A, 运行命令行 ui5 serve 启动本地服务器，然后访问 url http://localhost:8080/index.html, 看到如下界面。

左上角是一个 sap.m.Select 下拉控件，右下角有两个按钮，Normal 和 Error.

点击 Normal 按钮，能弹出正常的对话框，并且没有执行其他逻辑。因此这个对话框打开和关闭的完整过程，Select 控件显示的值都不变。按 Esc 关闭这个弹出的对话框。

然后点击 Error 按钮，这个按钮的事件处理函数里，会将 Select 控件的属性 selectedKey 所绑定的模型字段 SelectedProduct 的值清空，如下图高亮第 67，68 两行代码所示：

我们再点击 Error 按钮，此时发现 Select 控件显示的值，已经被更改成了整个应用初始化时，给 Select 控件设置的数据源的第一条记录：

同时，我们在 Chrome 开发者工具 UI5 Inspector 扩展里查看这个 Select 控件的属性，发现确实 selectedKey 值也跟着模型字段 SelectedProduct 的值一起被清空了，这是一个很典型的 SAP UI5 数据双向绑定的例子。

综上，本章节介绍了 Select 控件的显示值理论上可能会被哪些控件之外的逻辑或者代码修改的可能性。实际项目开发中遇到这种奇怪的现象，需要利用 UI5 Inspector 结合代码分析的方法来排除问题原因。