Question

我是Vue JS的新手。我需要在v-for中操作v-if数据，但结果并不像我预期的那样匹配split函数的最后一个数组，如下所示：

<tr v-for="list in lists.slice().reverse()">
            <td align="center">
              <span v-if="list.source_path.split('.').pop() == 'PNG'">
                  <img v-bind:src="list.source_path" height="100" width="100"/>
                </span>
              <span v-if="list.source_path.split('.').pop() == 'MP4'">
                  <video width='200' height="200" controls><source v-bind:src='list.source_path' type='video/mp4'></video>
                </span>
            </td>
</tr>

我认为该方法存在问题。你能给我一些指导来满足我的需求吗？

修改

列表数组：

[
 {
   "_id": "5afb828112e205917cb55abb",
   "task_id": 1526432385326,
   "source_path": "http://URL/fef27bbc50ae2dc8af6d5edfa34aedee_Android-PNG-Image.png",
   "status": 1,
   "time_start": "2018-05-16T00:59:45.326Z"
 }
]

Answer 1

您希望最后一项为此返回true：v-if="list.source_path.split('.').pop() == 'PNG'"

如果是，那么你应该list.source_path.split('.').pop().toUpperCase()

正确的方法来操纵v-if内部v-for

1 个答案: