javascript - KO 5秒延迟破坏了我的UI加载时

我正在制作一个网站，并且正在使用KO JavaScript来显示“登录并注册”（如果用户未登录）或“注销”（如果用户已登录）。所有功能均正常运行，但我的问题是页面加载时显示所有内容其中的5分之一秒，直到整个页面正确加载为止，然后触发并插入正确的语句。这看起来不太好，我真的希望它立即执行，因为它会影响我的UI。有人帮忙吗？

这是我的代码。

                <!--ko ifnot: Logged()-->
                   <a href="logged" class="ShowLogged">Log in</a>
                <!--/ko-->

                <!-- ko ifnot:Logged()-->
                   <a href="register" class="ShowRegister"> Register</a>
                <!--/ko-->

                <!-- ko if: Logged() -->
                   <a href="#" class="ShowLog" data-bind="click: Logged.Loggedout"> Log Out</a>
                <!--/ko-->

最佳答案

您可以使用template绑定来渲染该部分：

<!-- ko template: { name: 'logged-links'} -->
<!-- /ko -->

<script id="logged-links" type="text/html">
    <!--ko ifnot: Logged()-->
        <a href="logged" class="ShowLogged">Log in</a>
        <a href="register" class="ShowRegister"> Register</a>
    <!--/ko-->

    <!-- ko if: Logged() -->
        <a href="#" class="ShowLog" data-bind="click: Logged.Loggedout">
            Log Out
        </a>
    <!--/ko-->
</script>

在时间元素之间由浏览器呈现和调用ko.applyBindings（在您的情况下为5秒）之间，将忽略<!-- ko -->绑定，并且将您的链接视为普通的html标记。

通过将这些链接放在<script>标记中，浏览器将不会渲染它们，但是一旦调用ko.applyBindings就会进行剔除。

关于javascript - KO 5秒延迟破坏了我的UI加载时，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/26216660/