如何在 Vapor leaf 中分配变量?

How to assign variable in Vapor leaf?

我有一个使用代表所有数据的结构呈现 table 的神庙。

模板看起来像这样。

<div class="card shadow mb-4">
<div class="card-header py-3">
  <h6 class="m-0 font-weight-bold text-primary">DataTables Example</h6>
</div>
<div class="card-body">
  <div class="table-responsive">
    <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
      <thead>
        <tr>
          #for(colums in page.table.columns) {
              <th>#(colums)</th>
          }
        </tr>
      </thead>
      <tfoot>
        <tr>
          #for(colums in page.table.columns) {
              <th>#(colums)</th>
          }
        </tr>
      </tfoot>
      <tbody>
          #for(row in page.table.rows) {
            <tr>
            #for(data in row.datas) {
               <td>#(data)</td>
            }
            </tr>>
          }
      </tbody>
    </table>
  </div>
</div>
</div>

对于这种情况,这是可行的。但是假设在另一个页面中我有一个不同的数据结构。所以不是 page.table 而是 page.grid.table 我怎样才能继续使用这个模板?

我最初的想法是更改模板,使用 table.columns 而不是 page.table.columns,然后 "assign" 在我嵌入模板之前使用 table 变量。这样你也可以有多个 table 如果你喜欢并且在你嵌入它之前重新分配 table

我在网络开发方面不是很有经验,所以也许我只是想错了。

如果您使用条件检查变量是否存在,这将非常简单。

#if (page.table != nil) {
    #for(row in page.table.rows) {
        <tr>
             #for(data in row.datas) {
                 <td>#(data)</td>
             }
        </tr>>
    }
}else {
    #for(row in page.grid.table.rows) {
        <tr>
             #for(data in row.datas) {
                 <td>#(data)</td>
             }
        </tr>>
    }
}

这只是一个例子,你可以把代码多一点,但是基本是一样的,检查变量是否存在,然后使用它。

编辑: 例如,您可以使用存储相同类型变量的包装器 class。在上面的代码中,你有一个我猜字符串的矩阵,你可以做这样的事情:

class Wrapper: Content {
   let table: [[String]]

   init(table: [[String]]){
       self.table = table
   }
}

然后,如果你有 page.table,你可以将它投射到包装器中,例如:

let wrapper = Wrapper(table: page.table)

// Or if you have page.grid.table
let wrapper = Wrapper(table: page.grid.table)

然后像这样在 Vapor leaf 中使用它:

#for(row in wrapper.table) {
     <tr>
         #for(data in row.datas) {
              <td>#(data)</td>
         }
     </tr>>
}