NativeScript Grid Template

这个小助手允许您使用 NativeScript GridLayout 与 CSS grid-template-areas 值。

使用 Svelte Native 的示例（配置从 https://www.cssgridplayground.com/ 调整）

<script>
  import gridTemplateAreas from "nativescript-grid-template";
  const areas = gridTemplateAreas(`
    header header header
    sidebar main aside
    sidebar footer footer
  `);
</script>

<gridLayout rows="*, 5*, *" columns="*, 5*, 2*" orientation="vertical">
  <label text="header" {...areas.header} />
  <label text="sidebar" {...areas.sidebar} />
  <label text="main" {...areas.main} />
  <label text="aside" {...areas.aside} />
  <label text="footer" {...areas.footer} />
</gridLayout>

这只是一个简短的测试。对于无效的输入，如这个示例

a a a
a b b
a b c

行为是未定义的。欢迎提交增加验证功能的MR！