Frontend
Templating
Este documento solo aplica cuando se usa github.com/gobuffalo/buffalo/render.
Consulta github.com/gobuffalo/plush para más detalles sobre el paquete de plantillas.
Buffalo defaults to using plush as its template engine.
Introduction to Plush
Plush - Tips, Tricks and Testing
General Usage
Plush allows you to capture the context variables to use anywhere in your templates.
func myHandler(c buffalo.Context) error {
c.Set("name", "John Smith")
return c.Render(http.StatusOK, r.HTML("index.plush.html"))
}
<h1><%= name %></h1>
<h1>John Smith</h1>
Plush Examples
Conditional Statements
<%= if (true) { %>
<!-- some template content -->
<% } %>
<%= if (true) { %>
<!-- content when statement is true -->
<% } else { %>
<!-- content when statement is false -->
<% } %>
<%= if (value == 0) { %>
<!-- content when value is 0 -->
<% } else if (value == 1) { %>
<!-- content when value is 1 -->
<% } else { %>
<!-- content when value is different to 0 and 1 -->
<% } %>
<%= if ((value > 0) && (value < 10)) { %>
<!-- some template content -->
<% } else { %>
<!-- some template content -->
<% } %>
func MyHandler(c buffalo.Context) error {
// ...
c.Set("userName", "John Smith")
return c.Render(http.StatusOK, r.HTML("templates/index.plush.html"))
}
<%= if (userName != "") { %>
<span>Welcome <strong><%= userName %>!</strong></span>
<% } else { %>
<span>Welcome Visitor</span>
<% } %>
<span>Welcome <strong>John Smith!</strong></span>
Iterating
Through Slices
When looping through slices, the block being looped through will have access to the “global” context.
The for statement takes 1 or 2 arguments. When using the two arguments version, the first argument is the “index” of the loop and the second argument is the value from the slice.
func MyHandler(c buffalo.Context) error {
c.Set("names", []string{"John", "Paul", "George", "Ringo"})
return c.Render(http.StatusOK, r.HTML("index.plush.html"))
}
<!-- templates/index.plush.html -->
<ul>
<%= for (index, name) in names { %>
<li><%= index %> - <%= name %></li>
<% } %>
</ul>
<!-- Output -->
<ul>
<li>0 - John</li>
<li>1 - Paul</li>
<li>2 - George</li>
<li>3 - Ringo</li>
</ul>
<!-- templates/index.plush.html -->
<ul>
<%= for (name) in names { %>
<li><%= name %></li>
<% } %>
</ul>
<!-- Output -->
<ul>
<li>John</li>
<li>Paul</li>
<li>George</li>
<li>Ringo</li>
</ul>
Through Maps
Looping through maps using the each helper is also supported, and follows very similar guidelines to looping through arrays.
When using the two argument version, the first argument is the key of the map and the second argument is the value from the map:
func ColorsHandler(c buffalo.Context) error {
colors := map[string]interface{}{
"White": "#FFFFFF",
"Maroon": "#800000",
"Red": "#FF0000",
"Purple": "#800080",
}
c.Set("colors", colors)
return c.Render(http.StatusOK, r.HTML("home/colors.plush.html"))
}
<!-- templates/index.plush.html -->
<div>
<%= for (name, code) in colors { %>
<span><%= name %>: <%= code %></span>
<% } %>
</div>
<!-- Output -->
<div>
<span>White: #FFFFFF</span>
<span>Maroon: #800000</span>
<span>Red: #FF0000</span>
<span>Purple: #800080</span>
</div>
<!-- templates/index.plush.html -->
<div>
Color codes:
<%= for (code) in colors { %>
<span><%= code %></span>
<% } %>
</div>
<!-- Output -->
<div>
Color codes:
<span>#FFFFFF</span>
<span>#800000</span>
<span>#FF0000</span>
<span>#800080</span>
</div>