7
7
computed ,
8
8
onMounted ,
9
9
nextTick ,
10
+ watch ,
10
11
} from 'vue' ;
11
12
import LoadingOutlined from '@ant-design/icons-vue/LoadingOutlined' ;
12
13
import PropTypes from '../_util/vue-types' ;
@@ -27,7 +28,6 @@ const switchProps = {
27
28
checkedChildren : PropTypes . any ,
28
29
unCheckedChildren : PropTypes . any ,
29
30
tabindex : PropTypes . oneOfType ( [ PropTypes . string , PropTypes . number ] ) ,
30
- defaultChecked : PropTypes . looseBool ,
31
31
autofocus : PropTypes . looseBool ,
32
32
loading : PropTypes . looseBool ,
33
33
checked : PropTypes . looseBool ,
@@ -59,6 +59,14 @@ const Switch = defineComponent({
59
59
'`value` is not validate prop, do you mean `checked`?' ,
60
60
) ;
61
61
} ) ;
62
+ const checked = ref ( props . checked !== undefined ? ! ! props . checked : ! ! attrs . defaultChecked ) ;
63
+
64
+ watch (
65
+ ( ) => props . checked ,
66
+ ( ) => {
67
+ checked . value = ! ! props . checked ;
68
+ } ,
69
+ ) ;
62
70
63
71
const configProvider = inject ( 'configProvider' , defaultConfigProvider ) ;
64
72
const { getPrefixCls } = configProvider ;
@@ -75,9 +83,6 @@ const Switch = defineComponent({
75
83
const prefixCls = computed ( ( ) => {
76
84
return getPrefixCls ( 'switch' , props . prefixCls ) ;
77
85
} ) ;
78
- const checked = computed ( ( ) => {
79
- return 'checked' in props ? ! ! props . checked : ! ! props . defaultChecked ;
80
- } ) ;
81
86
82
87
onMounted ( ( ) => {
83
88
nextTick ( ( ) => {
@@ -91,6 +96,9 @@ const Switch = defineComponent({
91
96
if ( props . disabled ) {
92
97
return ;
93
98
}
99
+ if ( props . checked === undefined ) {
100
+ checked . value = check ;
101
+ }
94
102
emit ( 'update:checked' , check ) ;
95
103
emit ( 'change' , check , e ) ;
96
104
} ;
0 commit comments