浏览代码

chore: remove the global usage of functional components

eiinu 3 年之前
父节点
当前提交
4c7a0aed6a

+ 82 - 104
src/packages/__VUE/dialog/doc.en-US.md

@@ -15,7 +15,6 @@ import { Dialog } from '@nutui/nutui';
 
 const app = createApp();
 app.use(Dialog);
-
 ```
 
 
@@ -39,89 +38,89 @@ import { ref,createVNode } from 'vue';
 import { showDialog } from '@nutui/nutui';
 import '@nutui/nutui/dist/packages/dialog/style';
 export default {
-    setup() {
-        const onCancel = () => {
-          console.log('event cancel');
-        };
-        const onOk = () => {
-          console.log('event ok');
-        };
-        const baseClick = (): void => {
-          showDialog({
-            title: 'Basic spring frame',
-            content: createVNode('span', { style: { color: 'red' } }, 'I can be a custom component'),
-            onCancel,
-            onOk
-          });
-        };
-        const transparentClick = (): void => {
-          showDialog({
-            overlayStyle: { background: 'rgba(0,0,0,0)' },
-            title: 'Transparent Dialog',
-            content: 'Content',
-            onCancel,
-            onOk
-          });
-        };
-        const htmlClick = (): void => {
-          showDialog({
-            title: "Use html",
-            content:
-              "<p style='color:red'>html</p><img src='https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' />",
-            onCancel,
-            onOk
-          });
-        };
-        const beforeCloseClick = (): void => {
-          showDialog({
-            title: 'Before Close',
-            content: 'Click confirm to close it in 1 second',
-            onCancel,
-            onOk,
-            beforeClose: (action: string) => {
-              return new Promise((r) => {
-                setTimeout(() => {
-                  r(action == 'ok');
-                }, 1000);
-              });
-            }
-          });
-        };
-        const noTitleClick = () => {
-          showDialog({
-            content: 'Content',
-            onCancel,
-            onOk
-          });
-        };
-        const tipsClick = () => {
-          showDialog({
-            title: 'Title',
-            content: 'Function call and component call are supported.',
-            noCancelBtn: true,
-            onCancel,
-            onOk
-          });
-        };
-        const verticalClick = () => {
-          showDialog({
-            title: 'Title',
-            content: 'Support vertical arrangement of bottom buttons.',
-            footerDirection: 'vertical',
-            onCancel,
-            onOk
+  setup() {
+    const onCancel = () => {
+      console.log('event cancel');
+    };
+    const onOk = () => {
+      console.log('event ok');
+    };
+    const baseClick = (): void => {
+      showDialog({
+        title: 'Basic spring frame',
+        content: createVNode('span', { style: { color: 'red' } }, 'I can be a custom component'),
+        onCancel,
+        onOk
+      });
+    };
+    const transparentClick = (): void => {
+      showDialog({
+        overlayStyle: { background: 'rgba(0,0,0,0)' },
+        title: 'Transparent Dialog',
+        content: 'Content',
+        onCancel,
+        onOk
+      });
+    };
+    const htmlClick = (): void => {
+      showDialog({
+        title: "Use html",
+        content:
+          "<p style='color:red'>html</p><img src='https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' />",
+        onCancel,
+        onOk
+      });
+    };
+    const beforeCloseClick = (): void => {
+      showDialog({
+        title: 'Before Close',
+        content: 'Click confirm to close it in 1 second',
+        onCancel,
+        onOk,
+        beforeClose: (action: string) => {
+          return new Promise((r) => {
+            setTimeout(() => {
+              r(action == 'ok');
+            }, 1000);
           });
-        };
-        return {
-          baseClick,
-          transparentClick,
-          htmlClick,
-          beforeCloseClick,
-          noTitleClick,
-          tipsClick,
-          verticalClick
-        };
-    }
+        }
+      });
+    };
+    const noTitleClick = () => {
+      showDialog({
+        content: 'Content',
+        onCancel,
+        onOk
+      });
+    };
+    const tipsClick = () => {
+      showDialog({
+        title: 'Title',
+        content: 'Function call and component call are supported.',
+        noCancelBtn: true,
+        onCancel,
+        onOk
+      });
+    };
+    const verticalClick = () => {
+      showDialog({
+        title: 'Title',
+        content: 'Support vertical arrangement of bottom buttons.',
+        footerDirection: 'vertical',
+        onCancel,
+        onOk
+      });
+    };
+    return {
+      baseClick,
+      transparentClick,
+      htmlClick,
+      beforeCloseClick,
+      noTitleClick,
+      tipsClick,
+      verticalClick
+    };
+  }
 }
 </script>
 ```
@@ -144,29 +143,8 @@ showDialog({
 });
 ```
 
-### Function use proxy.&dialog(...)
-
-```javascript
-import { ref } from 'vue';
-import { showDialog } from '@nutui/nutui';
-import '@nutui/nutui/dist/packages/dialog/style';
-import { getCurrentInstance } from 'vue';
-
-export default {
-  setup() {
-    const { proxy } = getCurrentInstance();
-    proxy.$dialog({
-      title: 'Basic spring frame',
-      content: 'Function call and component call are supported.'
-    });
-  }
-}
-```
-
-
 ### Template use
 
-
 :::demo
 ```html
 <template>

+ 82 - 104
src/packages/__VUE/dialog/doc.md

@@ -15,7 +15,6 @@ import { Dialog } from '@nutui/nutui';
 
 const app = createApp();
 app.use(Dialog);
-
 ```
 
 
@@ -39,89 +38,89 @@ import { ref,createVNode } from 'vue';
 import { showDialog } from '@nutui/nutui';
 import '@nutui/nutui/dist/packages/dialog/style';
 export default {
-    setup() {
-        const onCancel = () => {
-          console.log('event cancel');
-        };
-        const onOk = () => {
-          console.log('event ok');
-        };
-        const baseClick = (): void => {
-          showDialog({
-            title: '基础弹框',
-            content: createVNode('span', { style: { color: 'red' } }, '我可以是一个自定义组件'),
-            onCancel,
-            onOk
-          });
-        };
-        const transparentClick = (): void => {
-          showDialog({
-            overlayStyle: { background: 'rgba(0,0,0,0)' },
-            title: '透明弹框',
-            content: 'Content',
-            onCancel,
-            onOk
-          });
-        };
-        const htmlClick = (): void => {
-          showDialog({
-            title: "支持富文本 html",
-            content:
-              "<p style='color:red'>html</p><img src='https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' />",
-            onCancel,
-            onOk
-          });
-        };
-        const beforeCloseClick = (): void => {
-          showDialog({
-            title: '异步关闭',
-            content: '点击确认后,1秒后关闭',
-            onCancel,
-            onOk,
-            beforeClose: (action: string) => {
-              return new Promise((r) => {
-                setTimeout(() => {
-                  r(action == 'ok');
-                }, 1000);
-              });
-            }
-          });
-        };
-        const noTitleClick = () => {
-          showDialog({
-            content: '无标题弹框',
-            onCancel,
-            onOk
-          });
-        };
-        const tipsClick = () => {
-          showDialog({
-            title: '温馨提示',
-            content: '支持函数调用和组件调用两种方式。',
-            noCancelBtn: true,
-            onCancel,
-            onOk
-          });
-        };
-        const verticalClick = () => {
-          showDialog({
-            title: '温馨提示',
-            content: '支持底部按钮纵向排列。',
-            footerDirection: 'vertical',
-            onCancel,
-            onOk
+  setup() {
+    const onCancel = () => {
+      console.log('event cancel');
+    };
+    const onOk = () => {
+      console.log('event ok');
+    };
+    const baseClick = (): void => {
+      showDialog({
+        title: '基础弹框',
+        content: createVNode('span', { style: { color: 'red' } }, '我可以是一个自定义组件'),
+        onCancel,
+        onOk
+      });
+    };
+    const transparentClick = (): void => {
+      showDialog({
+        overlayStyle: { background: 'rgba(0,0,0,0)' },
+        title: '透明弹框',
+        content: 'Content',
+        onCancel,
+        onOk
+      });
+    };
+    const htmlClick = (): void => {
+      showDialog({
+        title: "支持富文本 html",
+        content:
+          "<p style='color:red'>html</p><img src='https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' />",
+        onCancel,
+        onOk
+      });
+    };
+    const beforeCloseClick = (): void => {
+      showDialog({
+        title: '异步关闭',
+        content: '点击确认后,1秒后关闭',
+        onCancel,
+        onOk,
+        beforeClose: (action: string) => {
+          return new Promise((r) => {
+            setTimeout(() => {
+              r(action == 'ok');
+            }, 1000);
           });
-        };
-        return {
-          baseClick,
-          transparentClick,
-          htmlClick,
-          beforeCloseClick,
-          noTitleClick,
-          tipsClick,
-          verticalClick
-        };
-    }
+        }
+      });
+    };
+    const noTitleClick = () => {
+      showDialog({
+        content: '无标题弹框',
+        onCancel,
+        onOk
+      });
+    };
+    const tipsClick = () => {
+      showDialog({
+        title: '温馨提示',
+        content: '支持函数调用和组件调用两种方式。',
+        noCancelBtn: true,
+        onCancel,
+        onOk
+      });
+    };
+    const verticalClick = () => {
+      showDialog({
+        title: '温馨提示',
+        content: '支持底部按钮纵向排列。',
+        footerDirection: 'vertical',
+        onCancel,
+        onOk
+      });
+    };
+    return {
+      baseClick,
+      transparentClick,
+      htmlClick,
+      beforeCloseClick,
+      noTitleClick,
+      tipsClick,
+      verticalClick
+    };
+  }
 }
 </script>
 ```
@@ -144,29 +143,8 @@ showDialog({
 });
 ```
 
-### 函数调用 proxy.&dialog(...)
-
-```javascript
-import { ref } from 'vue';
-import { showDialog } from '@nutui/nutui';
-import '@nutui/nutui/dist/packages/dialog/style';
-import { getCurrentInstance } from 'vue';
-
-export default {
-  setup() {
-    const { proxy } = getCurrentInstance();
-    proxy.$dialog({
-      title: '基础弹框',
-      content: '支持函数调用和组件调用两种方式。'
-    });
-  }
-}
-```
-
-
 ### 标签式组件使用
 
-
 :::demo
 ```html
 <template>

+ 0 - 1
src/packages/__VUE/dialog/doc.taro.md

@@ -13,7 +13,6 @@ import { Dialog } from '@nutui/nutui-taro';
 
 const app = createApp();
 app.use(Dialog);
-
 ```
 
 ### 使用方式

+ 0 - 1
src/packages/__VUE/dialog/index.ts

@@ -71,7 +71,6 @@ const showDialog = function (options: DialogOptions) {
 };
 showDialog.install = (app: any) => {
   app.use(Dialog);
-  app.config.globalProperties.$dialog = showDialog;
 };
 export { showDialog };
 export default Dialog;

+ 0 - 1
src/packages/__VUE/imagepreview/index.ts

@@ -59,7 +59,6 @@ class ImagePreviewFunction {
 const showImagePreview = (options: ImagePreviewOptions): ImagePreviewFunction => new ImagePreviewFunction(options);
 showImagePreview.install = (app: any) => {
   app.use(ImagePreview);
-  app.config.globalProperties.$imagepreview = showImagePreview;
 };
 
 export { showImagePreview };

+ 6 - 6
src/packages/__VUE/notify/doc.en-US.md

@@ -51,12 +51,12 @@ export default {
 :::demo
 ```html
 <template>
-   <nut-cell-group title="Notify Type">
-      <nut-cell is-Link @click="primaryNotify('Primary Notify')">Primary Notify</nut-cell>
-      <nut-cell is-Link @click="successNotify('Success Notify')">Success Notify</nut-cell>
-      <nut-cell is-Link @click="errorNotify('Error Notify')">Error Notify</nut-cell>
-      <nut-cell is-Link @click="warningNotify('Warning Notify')">Warning Notify</nut-cell>
-    </nut-cell-group>
+  <nut-cell-group title="Notify Type">
+    <nut-cell is-Link @click="primaryNotify('Primary Notify')">Primary Notify</nut-cell>
+    <nut-cell is-Link @click="successNotify('Success Notify')">Success Notify</nut-cell>
+    <nut-cell is-Link @click="errorNotify('Error Notify')">Error Notify</nut-cell>
+    <nut-cell is-Link @click="warningNotify('Warning Notify')">Warning Notify</nut-cell>
+  </nut-cell-group>
 </template>
 <script lang="ts">
 import { ref } from 'vue';

+ 0 - 1
src/packages/__VUE/notify/index.ts

@@ -124,7 +124,6 @@ const showNotify = {
   },
   install(app: any): void {
     app.use(Notify);
-    app.config.globalProperties.$notify = showNotify;
   }
 };
 

+ 0 - 19
src/packages/__VUE/toast/doc.en-US.md

@@ -14,25 +14,6 @@ const app = createApp();
 app.use(Toast);
 ```
 
-
-### Global Usage
-:::demo
-``` html
-<template>
-</template>
-<script>
-import { getCurrentInstance } from 'vue';
-export default {
-  setup() {
-   const { proxy } = getCurrentInstance();
-    proxy.$toast.text('global usage');
-    return {};
-  }
-}
-</script>
-```
-:::
-
 ### Text
 :::demo
 ```html

+ 0 - 19
src/packages/__VUE/toast/doc.md

@@ -14,25 +14,6 @@ const app = createApp();
 app.use(Toast);
 ```
 
-
-### 全局使用方式
-:::demo
-``` html
-<template>
-</template>
-<script>
-import { getCurrentInstance } from 'vue';
-export default {
-  setup() {
-   const { proxy } = getCurrentInstance();
-    proxy.$toast.text('全局使用方式');
-    return {};
-  }
-}
-</script>
-```
-:::
-
 ### 文字提示
 :::demo
 ```html

+ 0 - 1
src/packages/__VUE/toast/index.ts

@@ -122,7 +122,6 @@ const showToast = {
   },
   install(app: any): void {
     app.use(Toast);
-    app.config.globalProperties.$toast = showToast;
   }
 };