下面el-switch代码片段是在el-table里使用 

<el-switch v-else-if="col.prop == 'status'" v-model="scope.row.status" :active-value="'0'" :inactive-value="'1'" :before-change="beforeStatus" @change="changStatus(scope.row.status, scope.row.goodsId)">
</el-switch>

el-switch方法代码是Vue3.0框架 typeScript语法格式

<script setup lang="ts">
// 该引入是全局封装getCurrentInstance()方法 代码在下面
import comInstance from "@/hooks/comInstance";// 获取全局属性
const { global } = comInstance();// 判断是否在点击弹窗确认按钮时才调用接口
const tags = ref('')// before方法加一个弹窗提示是否操作
const beforeStatus = async () => {const confirm = await global.$confirm('确定操作吗?');return new Promise((resolve, reject) => {if (confirm) {// 点击确认按钮时设置tags值tags.value = 'confirmStatus'return resolve(confirm)} else {return reject(confirm)}})
}const changStatus = async (type: string, goodsId: string) => {// 判断tags值 这样就不会进页面时调用了if (tags.value == 'confirmStatus') {const res = await upAndDownApi({goodsId: goodsId,status: type}).catch(() => { })if (res && res.code == 200) {// 刷新表格getGoodsList()}}
}
</script>

@/hooks/comInstance代码 全局封装getCurrentInstance()方法

getCurrentInstance()方法是Vue3 Composition API中的一个API函数。它的作用是返回一个组件实例对象，可以用来操作当前组件的各种属性和方法。这个方法是一个全局API，可以在任何地方使用。

import { getCurrentInstance, ComponentInternalInstance } from "vue";// 获取挂载属性
export default function useInstance() {const { appContext, proxy } = getCurrentInstance() as ComponentInternalInstanceconst global = appContext.config.globalProperties;return {proxy,global}
}