VueJS动态类

Question

阅读documentation我不明白如何改变课程。

我的组件数据如下所示：

props: [
  'm_c_id',
  'recipient_id',
  'sender_id',
  'userId'
],

现在，如果sender_id == userId我想在我的模板中显示：

<div class="msg-from-me">
   <p>Hello</p>
</div>

或如果recipient_id == userId我想表明这一点：

<div class="msg-from-them">
   <p>Hello</p>
</div>

Answer 1

您还可以使用三元运算符来切换类：

<div v-bind:class="[sender_id === userId ? msg-from-me : msg-from-them]">

这样，如果只有两个选项是sender_id或recipient_id，那么正确的类将会切换。