50 lines
		
	
	
		
			992 B
		
	
	
	
		
			Vue
		
	
	
			
		
		
	
	
			50 lines
		
	
	
		
			992 B
		
	
	
	
		
			Vue
		
	
	
| <docs>
 | |
| ---
 | |
| order: 2
 | |
| title:
 | |
|   zh-CN: æåååžæ 
 | |
|   en-US: Text & icon
 | |
| ---
 | |
| 
 | |
| ## zh-CN
 | |
| 
 | |
| å¸Ļææåååžæ ã
 | |
| 
 | |
| ## en-US
 | |
| 
 | |
| With text and icon.
 | |
| 
 | |
| </docs>
 | |
| 
 | |
| <template>
 | |
|   <div>
 | |
|     <a-switch v-model:checked="checked1" checked-children="åŧ" un-checked-children="å
ŗ" />
 | |
|     <br />
 | |
|     <a-switch v-model:checked="checked2" checked-children="1" un-checked-children="0" />
 | |
|     <br />
 | |
|     <a-switch v-model:checked="checked3">
 | |
|       <template #checkedChildren><check-outlined /></template>
 | |
|       <template #unCheckedChildren><close-outlined /></template>
 | |
|     </a-switch>
 | |
|   </div>
 | |
| </template>
 | |
| <script lang="ts">
 | |
| import { defineComponent, reactive, toRefs } from 'vue';
 | |
| import { CheckOutlined, CloseOutlined } from '@ant-design/icons-vue';
 | |
| export default defineComponent({
 | |
| 
 | |
|   components: {
 | |
|     CheckOutlined,
 | |
|     CloseOutlined,
 | |
|   },
 | |
|   setup() {
 | |
|     const state = reactive({
 | |
|       checked1: true,
 | |
|       checked2: false,
 | |
|       checked3: false,
 | |
|     });
 | |
|     return { ...toRefs(state) };
 | |
|   },
 | |
| });
 | |
| </script>
 |