CoderLearningCode
diff --git a/‎doc/doc.config.js
Lines changed: 8 additions & 1 deletion b/‎doc/doc.config.js
Lines changed: 8 additions & 1 deletion
diff --git a/‎doc/markdown/nToggle/en-US/index.md
Lines changed: 1 addition & 1 deletion b/‎doc/markdown/nToggle/en-US/index.md
Lines changed: 1 addition & 1 deletion
diff --git a/‎doc/markdown/nToggle/zh-CN/index.md
Lines changed: 5 additions & 2 deletions b/‎doc/markdown/nToggle/zh-CN/index.md
Lines changed: 5 additions & 2 deletions
diff --git a/‎packages/nTag/index.scss renamed to ‎packages/n-tag/index.scss b/‎packages/nTag/index.scss renamed to ‎packages/n-tag/index.scss
diff --git a/‎packages/nTag/index.tsx renamed to ‎packages/n-tag/index.tsx b/‎packages/nTag/index.tsx renamed to ‎packages/n-tag/index.tsx
diff --git a/‎packages/nToggle/src/index.scss renamed to ‎packages/n-toggle/index.scss b/‎packages/nToggle/src/index.scss renamed to ‎packages/n-toggle/index.scss
diff --git a/‎packages/n-toggle/index.tsx
Lines changed: 50 additions & 0 deletions b/‎packages/n-toggle/index.tsx
Lines changed: 50 additions & 0 deletions
diff --git a/‎packages/nToggle/src/index.vue renamed to ‎packages/n-toggle/src/index.vue b/‎packages/nToggle/src/index.vue renamed to ‎packages/n-toggle/src/index.vue
diff --git a/‎packages/nToggle/index.js
Lines changed: 0 additions & 7 deletions b/‎packages/nToggle/index.js
Lines changed: 0 additions & 7 deletions
diff --git a/‎src/index.ts
Lines changed: 2 additions & 2 deletions b/‎src/index.ts
Lines changed: 2 additions & 2 deletions
diff --git a/‎test/specs/toggle.spec.js
Lines changed: 1 addition & 1 deletion b/‎test/specs/toggle.spec.js
Lines changed: 1 addition & 1 deletion
@@ -279,7 +279,14 @@ export default {
             },
             {
               path: '/nToggle',
-              name: 'Toggle'
+              name: 'Toggle',
+              component: () => {
+                if (localLang === 'en-US') {
+                  return import('./markdown/nToggle/en-US/index.md');
+                } else {
+                  return import('./markdown/nToggle/zh-CN/index.md');
+                }
+              }
             },
             {
               path: '/nRate',
 
@@ -12,7 +12,7 @@ Use when you need to indicate the switch status.
 ```html
 <template>
   <div>
-    <n-toggle v-model="isOn" />
+    <n-toggle :checked="isOn" />
     <n-toggle :disabled="isDisabled"/>
   </div>
 </template>
 
@@ -13,8 +13,11 @@
 ```html
 <template>
   <div>
-    <n-toggle v-model="isOn" />
-    <n-toggle :disabled="isDisabled"/>
+    <n-toggle :checked="isOn" />
+    <span style="margin-left:20px">
+       <n-toggle :disabled="isDisabled"/>
+    </span>
+   
   </div>
 </template>
 
 
@@ -0,0 +1,50 @@
+// import nToggle from './src/index.vue';
+
+import { defineComponent, App, SetupContext } from 'vue'
+import './index.scss';
+
+const ToggleProps = {
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  checked: {
+    type: Boolean,
+    default: false
+  }
+}
+
+const NToggle = defineComponent({
+  name: 'NToggle',
+  props: ToggleProps,
+  setup(props, { emit }: SetupContext) {
+
+    const handleChange = () => {
+      emit('updateModel', props.checked);
+    }
+
+    return () => (
+      <div class="n-toggle">
+        <label>
+          <input
+            id="toggle"
+            checked={props.checked}
+            type="checkbox"
+            style="display: none;"
+            disabled={props.disabled}
+            onChange={handleChange}
+          />
+          <span
+            class="n-toggle-body"
+          />
+        </label>
+      </div>
+    )
+  }
+})
+
+NToggle.install = function (app: App) {
+  app.component(NToggle.name, NToggle);
+};
+
+export default NToggle;
@@ -1,6 +1,6 @@
 import './../assets/font/iconfont.scss';
 import { App } from 'vue';
-import { default as nTag } from '../packages/nTag';
+import { default as nTag } from '../packages/n-tag';
 import { default as nAlert} from '../packages/n-alert';
 import { default as nAvatar } from '../packages/n-avatar/index';
 import { default as nButton } from '../packages/n-button/index';
@@ -21,6 +21,7 @@ import { default as nMessage } from '../packages/n-message';
 import { default as nDrawer }  from '../packages/n-drawer';
 import { default as nPagination } from '../packages/n-pagination';
 import { default as nProgress } from '../packages/n-progress';
+import { default as nToggle } from '../packages/n-toggle';
 
 
 import nSidenavItem from '../packages/n-sidenav-item';
@@ -35,7 +36,6 @@ import nModal from '../packages/n-modal';
 
 
 // import nUpload from '../packages/nUpload';
-import nToggle from '../packages/nToggle';
 
 import nTooltip from '../packages/nTooltip';
 // import nTree from '../packages/nTree';
 
@@ -1,4 +1,4 @@
-import nToggle from '../../packages/nToggle';
+import nToggle from '../../packages/n-toggle';
 import { mount } from '@vue/test-utils';
 
 describe('nToggle', () => {
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import nToggle from '../../packages/nToggle';`
	`1`	`+import nToggle from '../../packages/n-toggle';`
`2`	`2`	`import { mount } from '@vue/test-utils';`
`3`	`3`
`4`	`4`	`describe('nToggle', () => {`