Vue多条件，如果条件里面的循环刀片laravel

Question

所以我在laravel的我的刀片模板中有这个条件，所有的项目值是从使用vue计算的方法获得的，问题是我想根据条件和它改变值有3个条件，这是我的代码：

<tr v-for="item in items"> 
         <td>@{{ item.nama }}</td> 
         <td>@{{ item.ndaftar }}</td> 
         <td> 
          <template v-if="item.status === 99"> 
           <img src='{{ asset("images/standby.jpg") }}'> 
          </template> 
          <template v-else-if="item.status = 0"> 
           <img src='{{ asset("images/failed.jpg") }}'> 
          </template> 
          <template v-else> 
           <img src='{{ asset("images/success.jpg") }}'> 
          </template> 
         </td> 
</tr> 

而且下面是我在antrian.js方法

getVueItems: function (page) { 
      this.$http.get('/antrianitems?page=' + page).then((response) => { 
       this.$set('items', response.data.data.data); 
       this.$set('pagination', response.data.pagination); 
      }); 
     }, 

在Laravel是非常简单的只用，如果用链条拴住它甚至在for循环中，但我在vue中不能像那样工作，而且模板甚至只支持if和else，没有别的 - 如果。

如果@ {{item.status}} = 99，那么显示的图像待机，
如果@ {{item.status}} = 0，则显示的图像：

如何在刀片模板使用VUE实现失败，
其他然后显示图像的成功，提前

谢谢...

Answer 1

Vue公司确实支持else-if，虽然只是因为2.1.0，也许你只需要一个较新的版本。

虽然你的代码应该在技术上有效，但是你有一些语法问题（在第8行中，你应该使用做一个比较而不是一个任务，并且似乎有一个剩余--}}）。

但一个更清洁的方式做到这一点会在你的组件写一个方法：

methods: { 
    getItemImage: function(status) { 
    if (status === 99) { 
     return 'Standby'; 
    } else if (status === 0) { 
     return 'Failed'; 
    } else { 
     return 'Success'; 
    } 
    } 
} 

那么你的模板，可以简化为：

<tr v-for="item in items"> 
    <td>@{{ item.nama }}</td> 
    <td>@{{ item.ndaftar }}</td> 
    <td> 
    <img :src="getItemImage(item.status) + '.jpg'" /> 
    </td> 
</tr>