laravel 如何在Vue标记中将整数转换为相应的字符串?

8tntrjer  于 2023-01-27  发布在  其他
关注(0)|答案(2)|浏览(124)

我有一个用于从数据库获取数据的表。我使用“status”字段来管理这个表。
如果状态= 1,则表示“活动”,否则如果状态= 2,则表示“完成”,否则如果状态= 0,则表示“删除”。
然后我需要在网页表中显示上面的状态字。我用下面的来显示状态号。

<tr v-for="(depAcc, index) in depAccs" :key="index">
  <td>{{ index + 1 }}</td>
  <td>{{ depAcc.created_at }}</td>
  <td>{{ depAcc.name }}</td>
  <td>{{ depAcc.status }}</td>

请指示我在桌上显示状态字。

t40tm48m

t40tm48m1#

我将创建一个包含状态图的数据属性,如下所示:

data() {
  return {
    statusNames: {
      0: 'Deleted',
      1: 'Active',
      2: 'Completed'
    }
  }
}

然后可以在标记中引用它:

<td>{{ statusNames[depAcc.status] }}</td>
njthzxwz

njthzxwz2#

在Vue中,双大括号{{ //this }}内的任何内容都被计算为JS。因此,您可以编写一个方法来根据您的状态返回字符串,然后将一个函数放入双大括号中。

<tr v-for="(depAcc, index) in depAccs" :key="index">
    <td>{{ index + 1 }}</td>
    <td>{{ depAcc.created_at }}</td>
    <td>{{ depAcc.name }}</td>
    <td>{{ statusText(depAcc.status) }}</td>
</tr>

然后在页面脚本中添加以下方法

var app = new Vue({
    el: '#app',
    methods:{
        statusText(status){
            let message = "Unknown Status"
            if (status == 0) message = "Deleted"
            if (status == 1) message = "Active"
            if (status == 2) message = "Completed"
            return message
        }
    }
});

相关问题