ES6中includes()方法在el-table表格使用

陳那个陈

已于 2023-09-22 11:36:09 修改

阅读量142

点赞数

文章标签： es6 前端 vue.js elementui

于 2023-09-22 11:32:43 首次发布

本文链接：https://blog.csdn.net/weixin_52164116/article/details/133162464

版权

效果图:

代码：

<div class="indexPipeData">
      <el-table
        :data="indexPipeData"
        border
        stripe
        style="width: 100%"
        v-loading="loading"
      >
        <el-table-column
          type="index"
          label="序号"
          width="55"
          align="center"
        ></el-table-column>

        <el-table-column
          prop="name"
          label="检测项名称"
        ></el-table-column>
        <el-table-column label="检测项类别" width="130" prop="indexType">
          <template #default="scope">
            <dict-tag
              :options="indexType"
              :value="scope.row.indexType"
              :tag="false"
            />
          </template>
        </el-table-column>


         //groups字段includes()方法使用
        <el-table-column prop="groups" label="幼儿组" width="90">
          <template #default="scope">
            <span v-if="scope.row.groups.includes(1)">适用</span></template
          ></el-table-column
        >
        <el-table-column prop="groups" label="成年甲组" width="90">
          <template #default="scope">
            <span v-if="scope.row.groups.includes(2)">适用</span></template
          ></el-table-column
        >
        <el-table-column prop="groups" label="成年乙组" width="90">
          <template #default="scope">
            <span v-if="scope.row.groups.includes(3)">适用</span>
          </template>
        </el-table-column>
        <el-table-column prop="groups" label="老年组" width="90">
          <template #default="scope">
            <span v-if="scope.row.groups.includes(4)">适用</span></template
          ></el-table-column
        >

        <el-table-column prop="unit" label="单位" width="90"></el-table-column>

        
        //sex字段includes()方法使用
        <el-table-column prop="sex" label="适用性别" width="90">
          <template #default="scope">
            <span v-if="scope.row.sex.includes(1)">男,</span>
            <span v-if="scope.row.sex.includes(2)">女</span>
          </template>
        </el-table-column>


        <el-table-column prop="status" label="状态" width="150">
          <template #default="scope">
            <el-switch
              v-model="scope.row.status"
              active-text="启用"
              inactive-text="禁用"
              :active-value="1"
              :inactive-value="0"
              @change="siteStatusChange(scope.row)"
            ></el-switch> </template
        ></el-table-column>
      </el-table>
    </div>

includes()的使用

数组中includes()方法_cbyr的博客-CSDN博客