Element-Plus Swtich Bug..@change自动被触发

页面渲染完毕总是会触发一次@change,主要是因为active-value没有使用
bool类型,并且同样逻辑的代码在vue2中完全没有问题,不是eplus就是vue3的问题…

<template>
  <!-- 定义后台欢迎页面 -->
  <div>
    <h1>我是后台欢迎页面</h1>
    <el-table :data="itemList" style="width: 100%" stripe border>
      <el-table-column prop="status" label="状态" width="80px">
        <template v-slot="scope">
          <el-switch v-model="scope.row.status"
                     active-color="#13ce66"
                     inactive-color="#ff4949"
                     active-value="1"
                     inactive-value="2"
                     @change="updateStatus(scope.row)">
          </el-switch>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import {reactive, toRefs} from 'vue'

export default {
  name: "Welcome",
  setup() {
    const item = {id: 1, status: "1"}
    const item1 = {id: 1, status: "2"}
    const root = reactive({
      itemList: [item,item1]
    })
    const updateStatus = (item) => {
      console.log(item)
    }
    return {
      ...toRefs(root), updateStatus
    }
  }
}
</script>

<style>
</style>

本人主学后端,希望前端大佬能指出问题,并求个解决方案…

你可能感兴趣的:(问题解决,vue)