WinJS:是否可以通过程序向数据透视项添加预算

WinJS: Is it posible to add a budge to a Pivot Item programatically?

本文关键字：透视 添加 数据 是否 可以通过 程序 WinJS      更新时间：2023-09-26

我正在用WinJS构建一个Windows Phone 8.1应用程序，我在Pivot元素中有一个PivotItem：

<div data-win-control="WinJS.UI.Pivot">
    <div class="conversations"
         data-win-control="WinJS.UI.PivotItem"
         data-win-res="{winControl: {'header': 'conversations'}}">
     </div>
</div>

我试图在标题旁边添加一个预算，以显示与Facebook通知计数类似的未读对话计数，但没有成功。

已尝试：

WinJS.UI.Pages.define("/conversations.html", {
ready: function (element, options) {
        var span = document.createElement('DIV')
        span.innerHTML = "<span>5</span>";
        var p = document.querySelector(".conversations");
        p.appendChild(span);
    }
}

还有CSS：

.conversations ::after{
    content: "3";
}

但仍然没有运气。有什么想法吗？

提前感谢！

找到一个解决方法：

var pivotHeader = document.querySelector(".win-pivot-headers");
if(pivotHeader != null)
{
        var headers = pivotHeader.childNodes;
        for (var i = 0; i < headers.length; i++) {
            var badge = document.createElement('span');
            badge.id = "unseenConversationsBudge";
            badge.innerHTML = "10";
            headers[i].appendChild(badge);
            WinJS.UI.Animation.fadeIn(badge);
        }
    }

然后在应用程序的inialization事件和头项的animationstart/animationend事件中处理它。还必须检查并删除跨度(如果存在(，以避免重复。

相关文章：