放置在 CSS 网格中时，Windows 8 ListView 控件不显示答案

【问题标题】：Windows 8 ListView Control not showing up when placed inside a CSS Grid放置在 CSS 网格中时，Windows 8 ListView 控件不显示
【发布时间】：2013-01-05 16:32:44
【问题描述】：

我正在按照 Microsoft 教程“快速入门：添加 ListView”（由于防止垃圾邮件而无法发布链接）进行 Windows 8 应用程序开发，并且我正在尝试以 ListView 格式简单地显示我的数组中的原始数据。我稍微修改了本教程，以便我使用 CSS Grids 来构建页面（我相信，正如 Microsoft 推荐的那样）。我遇到的问题是，当 ListView 位于网格之外时，它会完美地显示和显示，但是当位于 CSS 网格内时，不会显示在我的应用程序中。我对 CSS 网格和新的 Windows 8 平台的知识非常有限，所以我确信这是我犯的一个简单的错误。下面是我的 CSS 和 HTML 代码，所有的 Javascript 都应该与微软教程中使用的相同...

http://pastebin.com/cgV5PHnf - HTML

http://pastebin.com/HvVPuhkG - CSS

【问题讨论】：

标签： css windows-8 microsoft-metro windows-runtime winjs

【解决方案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 类覆盖。

【讨论】：

使用您的 tempData.js，我的应用程序运行良好，因此我将现有数据调整为您的格式，这与快速入门中的不同，现在我的应用程序可以运行了！谢谢...