优化 cl-switch 组件

This commit is contained in:
icssoa 2024-02-19 14:30:26 +08:00
parent d9b2405184
commit 9c56a99c49
4 changed files with 18 additions and 23 deletions

View File

@ -33,8 +33,6 @@
<template #column-isShow="{ scope }"> <template #column-isShow="{ scope }">
<cl-switch <cl-switch
v-model="scope.row.isShow" v-model="scope.row.isShow"
:active-value="true"
:inactive-value="false"
:scope="scope.row" :scope="scope.row"
:column="scope.column" :column="scope.column"
v-if="scope.row.type != 2" v-if="scope.row.type != 2"
@ -47,8 +45,6 @@
<template #column-keepAlive="{ scope }"> <template #column-keepAlive="{ scope }">
<cl-switch <cl-switch
v-model="scope.row.keepAlive" v-model="scope.row.keepAlive"
:active-value="true"
:inactive-value="false"
:scope="scope.row" :scope="scope.row"
:column="scope.column" :column="scope.column"
v-if="scope.row.type == 1" v-if="scope.row.type == 1"

View File

@ -21,11 +21,7 @@
<template #slot-relevance="{ scope }"> <template #slot-relevance="{ scope }">
<div> <div>
<el-row> <el-row>
<el-switch <cl-switch v-model="scope.relevance" />
v-model="scope.relevance"
:active-value="1"
:inactive-value="0"
/>
<span <span
:style="{ :style="{

View File

@ -1,6 +1,6 @@
import { useCrud } from "@cool-vue/crud"; import { useCrud } from "@cool-vue/crud";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { defineComponent, ref, watch } from "vue"; import { defineComponent, nextTick, ref, watch } from "vue";
import { isBoolean, isFunction } from "lodash-es"; import { isBoolean, isFunction } from "lodash-es";
export default defineComponent({ export default defineComponent({
@ -30,14 +30,20 @@ export default defineComponent({
// 状态 // 状态
const status = ref<boolean | number | string>(); const status = ref<boolean | number | string>();
const activeValue = ref();
const inactiveValue = ref();
watch( watch(
() => props.modelValue, () => props.modelValue,
(val: any) => { (val) => {
if (isBoolean(props.activeValue)) { if (isBoolean(props.modelValue)) {
status.value = Boolean(val); activeValue.value = true;
} else { inactiveValue.value = false;
status.value = val;
} }
nextTick(() => {
status.value = val;
});
}, },
{ {
immediate: true immediate: true
@ -82,8 +88,8 @@ export default defineComponent({
return ( return (
<el-switch <el-switch
v-model={status.value} v-model={status.value}
active-value={props.activeValue} active-value={activeValue.value}
inactive-value={props.inactiveValue} inactive-value={inactiveValue.value}
onChange={onChange} onChange={onChange}
onClick={onClick} onClick={onClick}
/> />

View File

@ -3,8 +3,8 @@ export default () => {
label: "文件上传", label: "文件上传",
description: "基于 el-upload 封装的文件上传组件", description: "基于 el-upload 封装的文件上传组件",
author: "COOL", author: "COOL",
version: "1.1.0", version: "1.1.1",
updateTime: "2024-02-05", updateTime: "2024-02-19",
demo: [ demo: [
{ {
name: "基础用法", name: "基础用法",
@ -48,10 +48,7 @@ export default () => {
size: 100 size: 100
}, },
// 云端上传路径前缀 // 云端上传路径前缀
prefixPath: { prefixPath: "app/base",
type: String,
default: "app/base"
},
// 规则 // 规则
rules: [ rules: [
{ {