如何使用 if-else 作为小胡子语法？

Question

读完这篇文章后，我按照 Vue.js 中的文章进行了尝试，但它只发出错误。

<tr v-for="(data, i) in userList" :key="i">
<td>{{#data.authority==1}}Admin{{/data.authority==1}}</td>
</tr>

如果我只写 {{data.authority}} 那么效果很好。

如何在 Vue.js 中使用 if-else 作为 mustache 语法？

Answer 1

Vue 使用 mustache 语法进行插值，其工作方式与您分享的 post 不同。你在 {{}} 中写的任何东西都会被 JavaScript 评估。

因此，您可以编写任何类型的表达式：

{{ 2 + 2 }} // output will be 4
{{ 'Hell World' }} // output: 'Hello World'

所以，在你的情况下，你可以写一个三元运算符：

<tr v-for="(data, i) in userList" :key="i">
  <td>{{ data.authority === 1 ? 'Admin' : 'Not Admin' }}</td>
</tr>

如果您只想在 user.authority === 1 时显示 td 元素，您应该改用 v-if 或 v-show。

您可以在 {{}} 中使用表达式而不是语句。所以普通的 if/else 是行不通的。

Answer 2

就像小胡子里的香草 js： {{ data.auth ? 'user' : 'guest'}}

How to use if-else as mustache grammar?