Office UI Fabric DetailsList 复选框在移动设备上呈现不正确答案

【问题标题】：Office UI Fabric DetailsList checkboxes rendered incorrectly on mobile devicesOffice UI Fabric DetailsList 复选框在移动设备上呈现不正确
【发布时间】：2019-01-21 17:41:45
【问题描述】：

在移动设备上查看时，Office UI Fabric DetailsList 组件的行为很奇怪。当您选中列表中的选定项目时，所有复选框都会突然出现（未选中）。

选择前：

选择后：

您可以使用此 codepen 进行复制：https://codepen.io/elegault/pen/GPwNMQ

只需打开浏览器开发工具并从模拟器列表中选择任何设备，然后切换选择。您会注意到在完整浏览器模式下不会全部显示复选框。

我找不到控制它的 DetailsList 组件的任何属性。我的组件的设置如下。这种行为是设计使然还是错误？

        const projects = <Fabric.DetailsList
            items={this.state.items}
            componentRef={this._detailsListRef}
            columns={columns}    
            selectionMode={Fabric.SelectionMode.single}
            selectionPreservedOnEmptyClick={true}
            enterModalSelectionOnTouch={true}
            selection={this._selection}
        />;

【问题讨论】：

标签： office-ui-fabric

【解决方案1】：

查看这个简单的详细信息列表示例，我没有看到相同的行为。

https://codepen.io/dzearing/pen/EgqMZq

<p>

您能否创建一个简化的测试用例，然后如果您仍然看到问题，请将问题提交给https://github.com/OfficeDev/office-ui-fabric-react/

【讨论】：

你是对的，你的不能复制。我有一个不一样的：codepen.io/elegault/full/wQxoRR。请注意，我的原始版本不能在 Firefox 中重现，但它在 Chrome 上的模拟器模式和 iOS 上的 Safari 中可以重现 - 请尝试这些。
这是一个精简的 repo：codepen.io/elegault/full/JxGpQg。同样，在设备模拟器模式下的 Chrome 或 iOS 上的 Safari 中查看它。 onChange 和 onSelectionChanged 事件不是问题的一部分，因为这些事件未绑定时会出现问题。

【解决方案2】：

Microsoft 已验证此行为是设计使然： https://github.com/OfficeDev/office-ui-fabric-react/issues/7808

“这个想法是，在触摸屏设备上，它会向您显示复选框，以便您知道可以选择和不能选择的内容（与鼠标控制的设备相反，他们可以选择将鼠标悬停在一行上以查看复选框可见）。”

【讨论】：