chore: demo ts (#8160)

* chore: demo ts

* chore: fix

src/checkbox/demo/index.vue

@@ -103,10 +103,11 @@
   </demo-block>
 </template>
 
-<script>
+<script lang="ts">
 import { ref, reactive, toRefs } from 'vue';
 import { useTranslate } from '@demo/use-translate';
 import { useRefs } from '../../composables/use-refs';
+import { ComponentInstance } from 'src/utils';
 
 const i18n = {
   'zh-CN': {
@@ -159,19 +160,19 @@ export default {
       horizontalResult: [],
     });
 
-    const group = ref();
-    const [refs, setRefs] = useRefs();
+    const group = ref<ComponentInstance>();
+    const [refs, setRefs] = useRefs<ComponentInstance>();
 
-    const toggle = (index) => {
+    const toggle = (index: number) => {
       refs.value[index].toggle();
     };
 
     const checkAll = () => {
-      group.value.toggleAll(true);
+      group.value?.toggleAll(true);
     };
 
     const toggleAll = () => {
-      group.value.toggleAll();
+      group.value?.toggleAll();
     };
 
     return {