将 {{if @last}} 把手模板翻译成 vue 2.0 [英] Translate {{if @last}} handlebars templates to vue 2.0

问题描述

我想逐步从 Backbone + Handlebars 切换到 Vue，但我在使用 Handlebars 模板时遇到了一些问题.

在我的一个模板中，我有这样的东西:

{{#each tHeads}}{{#if @last}}{{#每个}}{{#if iWidth}}<col style="width: {{iWidth}}px;"/>{{/如果}}{{/每个}}{{/如果}}{{/每个}}

我想将其转换为 vue 模板，但无法从 Handlebars 中找到对应的 @last helper.

解决方案

Vue 中没有类似 @last 的实现，正如 Evan You 解释的 此处 拥有这样的功能代价高昂，而且每个 v-for 循环.

您可以为此定义一个方法 isLast 并使用它，如下所示:

JS

方法:{isLast(索引){返回 this.list.length === 索引 + 1}}

I want to progressively switch from Backbone + Handlebars to Vue, but I am having some troubles with Handlebars templates.

In one of my templates I have something like this:

{{#each tHeads}}
  {{#if @last}}
    {{#each th}}
      {{#if iWidth}}
        <col style="width: {{iWidth}}px;"/>
      {{/if}}
    {{/each}}
  {{/if}}
{{/each}}

I want to translate this to a vue template, but cannot find the corresponding for @last helper from Handlebars.

解决方案

There is no implementation for something like @last in Vue, as Evan You explained here that it will be costly to have such feature which are also used not that frequently for each v-for loop.

You can define a method isLast for this and use it like following:

<div v-if="isLast(index)">

JS

methods: {
  isLast (index) {      
    return this.list.length === index + 1
  }
}

这篇关于将 {{if @last}} 把手模板翻译成 vue 2.0的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！