fix: update Notification and test

hug-sun · Nov 12, 2020 · 0045efb · 0045efb
1 parent e7ef2c7
commit 0045efb
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 17 deletions.
diff --git a/examples/docs/zh-CN/notification.md b/examples/docs/zh-CN/notification.md
@@ -26,10 +26,9 @@
   import {useNotify} from 'element3'
   export default {
     setup(){
-console.log(useNotify,11)
-      let {$notify} = useNotify()
+      let notify = useNotify()
       function open1() {
-        $notify({
+        notify({
           title: '标题名称',
           message: h('i', { style: 'color: teal'}, '这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案这是提示文案')
         });
@@ -83,10 +82,10 @@ console.log(useNotify,11)
   import {useNotify} from 'element3'
   export default {
     setup(){
-      let $notify = useNotify()
+      let notify = useNotify()
 
       function open1() {
-        $notify({
+        notify({
           title: '成功',
           message: '这是一条成功的提示消息',
           type: 'success'
@@ -152,34 +151,35 @@ console.log(useNotify,11)
   import {useNotify} from 'element3'
   export default {
     setup(){
-      let $notify = useNotify()
+      let notify = useNotify()
       function open1() {
-        $notify({
+        notify({
           title: '自定义位置',
           message: '右上角弹出的消息'
         });
       }
       function open2() {
-        $notify({
+        notify({
           title: '自定义位置',
           message: '右下角弹出的消息',
           position: 'bottom-right'
         });
       }
       function open3() {
-        $notify({
+        notify({
           title: '自定义位置',
           message: '左下角弹出的消息',
           position: 'bottom-left'
         });
       }
       function open4() {
-        $notify({
+        notify({
           title: '自定义位置',
           message: '左上角弹出的消息',
           position: 'top-left'
         });
       }
+      return {open1,open2,open3,open4}
     }
   }
 </script>
@@ -204,10 +204,10 @@ console.log(useNotify,11)
   import {useNotify} from 'element3'
   export default {
     setup(){
-      let $notify = useNotify()
+      let notify = useNotify()
 
       function open() {
-        $notify({
+        notify({
           title: '偏移',
           message: '这是一条带有偏移的提示消息',
           offset: 100

diff --git a/packages/notification/Notification.vue b/packages/notification/Notification.vue
@@ -72,6 +72,7 @@ export default {
     title: { type: String, default: '' },
     type: { type: String, default: '' }
   },
+  emits: ['close'],
   setup(props) {
     // eslint-disable-next-line vue/no-setup-props-destructure
     const { duration, onClose, onClick } = props
@@ -82,10 +83,12 @@ export default {
     })
 
     const horizontalClass = computed(() => {
+      console.log(props.position.indexOf('right') > -1 ? 'right' : 'left')
       return props.position.indexOf('right') > -1 ? 'right' : 'left'
     })
 
     const verticalProperty = computed(() => {
+      console.log(props.position.startsWith('top') ? 'top' : 'bottom')
       return props.position.startsWith('top') ? 'top' : 'bottom'
     })
 

diff --git a/types/element3.d.ts b/types/element3.d.ts
@@ -34,7 +34,7 @@ export { ElSlider } from './slider'
 export { ElSwitch } from './switch'
 export { ElLink } from './link'
 export { ElMessage } from './message'
-
+export { ElNotification } from './notification'
 import { ElCollapse } from './collapse'
 import { ElCollapseItem } from './collapse-item'
 import { ElColorPicker } from './color-picker'
@@ -54,7 +54,6 @@ import { ElMenu } from './menu'
 import { ElMenuItem } from './menu-item'
 import { ElMenuItemGroup } from './menu-item-group'
 import { ElMessageBox } from './message-box'
-import { ElNotification } from './notification'
 import { ElOption } from './option'
 import { ElOptionGroup } from './option-group'
 import { ElPopover } from './popover'
@@ -117,9 +116,6 @@ export const Loading: ElLoading
 /** A set of modal boxes simulating system message box, mainly for message prompt, success tips, error messages and query information */
 export const MessageBox: ElMessageBox
 
-/** Displays a global notification message at the upper right corner of the page */
-export const Notification: ElNotification
-
 /** Collapse Component */
 export class Collapse extends ElCollapse { }