使淘汰赛“可见”使用CSS“可见性”属性

Question

根据the "visible" binding documentation，如果visible 的值计算为false，Knockout 使用display: none 隐藏元素。我怎样才能让它改用visibility: hidden？ visibility: hidden 的优势（在这种情况下）仍然使元素占用页面空间。

Answer 1

您应该使用纯 css 样式或类，查看官方 knockout.js css binding 或 knockout.js style binding 文档。

样式绑定示例：

<div data-bind="style: { visibility: isVisible()  ? 'visible' : 'hidden' }">
    Profit Information
</div>

<script type="text/javascript">
    var viewModel = {
        isVisible: ko.observable(true) // visible
    };
    viewModel.isVisible(false); // hidden
</script>