css - Windows 8 ListView 控件在放置在 CSS 网格中时不显示

Question

我正在遵循针对 Windows 8 应用程序开发的 Microsoft 教程“快速入门:添加 ListView”(由于防止垃圾邮件而无法发布链接)，我试图以 ListView 格式简单地显示数组中的原始数据。我稍微修改了教程，以便使用 CSS 网格来构建页面(我相信这是 Microsoft 推荐的)。我遇到的问题是，当 ListView 位于网格外部时，它可以完美地显示和显示，但是当位于 CSS 网格内部时，它不会显示在我的应用程序中。我对 CSS 网格和新的 Windows 8 平台的了解都非常有限，所以我确信这是我犯的一个简单错误。下面是我的 CSS 和 HTML 代码，所有的 Javascript 应该与 Microsoft 教程中使用的相同...

http://pastebin.com/cgV5PHnf - HTML

http://pastebin.com/HvVPuhkG - CSS

Answer 1

有了您的 HTML 和 CSS，数据对我来说一字不差。这是我的 tempData.js:

(function () {
    "use strict";

    var items = new WinJS.Binding.List();
    items.push({ value1: "foo", value2: "bar" });
    items.push({ value1: "foo2", value2: "bar2" });

    WinJS.Namespace.define("TempData", {
        itemList: items.dataSource
    });
})();

请注意，我在 itemList 的定义中包含了 dataSource，因为您的 data-win-options 没有包含它(Quickstart 拉到属性中)。如果没有它，你会得到一个非常明显的异常，所以怀疑你在你的 TempData 定义中做同样的事情。

您可以尝试在 Visual Studio 中使用 DOM Explorer 或在 Blend 中打开应用程序并使用 Interactive Mode 查看是否存在某种意外的 CSS 类覆盖。