mirror of https://github.com/ElemeFE/element
add .type on Notification and Message
parent
805e8fc112
commit
3d60efd468
|
@ -7,6 +7,7 @@
|
|||
- 修复 Tabs 切换后 Tab-panel 被销毁的问题
|
||||
- 修复 TimePicker 错误的隐藏面板
|
||||
- 修复 Table Cell 的样式, #204
|
||||
- 为 Notification 和 Message 的不同 type 添加独立的调用方法
|
||||
- 为 Message Box 和 Dialog 添加 lockScroll 属性,用于定义是否在弹框出现时将 body 滚动锁定
|
||||
- 新增 Input textarea 类型的 rows, autosize 属性
|
||||
|
||||
|
|
|
@ -20,10 +20,7 @@
|
|||
},
|
||||
|
||||
open4() {
|
||||
this.$message({
|
||||
message: '错了哦,这是一条错误消息',
|
||||
type: 'error'
|
||||
});
|
||||
this.$message.error('错了哦,这是一条错误消息');
|
||||
},
|
||||
|
||||
open5() {
|
||||
|
@ -99,7 +96,7 @@
|
|||
|
||||
用来显示「成功、警告、消息、错误」类的操作反馈。
|
||||
|
||||
:::demo 当需要自定义更多属性时,Message 也可以接收一个对象为参数。比如,设置`type`字段可以定义不同的状态,默认为`info`。此时正文内容以`message`的值传入。
|
||||
:::demo 当需要自定义更多属性时,Message 也可以接收一个对象为参数。比如,设置`type`字段可以定义不同的状态,默认为`info`。此时正文内容以`message`的值传入。同时,我们也为 Message 的各种 type 注册了方法,可以在不传入`type`字段的情况下像`open4`那样直接调用。
|
||||
```html
|
||||
<template>
|
||||
<el-button :plain="true" @click.native="open2">成功</el-button>
|
||||
|
@ -126,10 +123,7 @@
|
|||
},
|
||||
|
||||
open4() {
|
||||
this.$message({
|
||||
message: '错了哦,这是一条错误消息',
|
||||
type: 'error'
|
||||
});
|
||||
this.$message.error('错了哦,这是一条错误消息');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -201,7 +195,7 @@ element 为 Vue.prototype 添加了全局方法 $message。因此在 vue instanc
|
|||
import { Message } from 'element-ui';
|
||||
```
|
||||
|
||||
此时调用方法为 `Message(options)`。
|
||||
此时调用方法为 `Message(options)`。我们也为每个 type 定义了各自的方法,如 `Message.success(options)`。
|
||||
|
||||
### Options
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
||||
|
|
|
@ -33,18 +33,16 @@
|
|||
},
|
||||
|
||||
open5() {
|
||||
this.$notify({
|
||||
this.$notify.info({
|
||||
title: '消息',
|
||||
message: '这是一条消息的提示消息',
|
||||
type: 'info'
|
||||
message: '这是一条消息的提示消息'
|
||||
});
|
||||
},
|
||||
|
||||
open6() {
|
||||
this.$notify({
|
||||
this.$notify.error({
|
||||
title: '错误',
|
||||
message: '这是一条错误的提示消息',
|
||||
type: 'error'
|
||||
message: '这是一条错误的提示消息'
|
||||
});
|
||||
},
|
||||
|
||||
|
@ -113,7 +111,7 @@
|
|||
|
||||
带有 icon,常用来显示「成功、警告、消息、错误」类的系统消息
|
||||
|
||||
::: demo Element 为 Notification 组件准备了四种通知类型:`success`, `warning`, `info`, `error`。通过`type`字段来设置,除此以外的值将被忽略。
|
||||
::: demo Element 为 Notification 组件准备了四种通知类型:`success`, `warning`, `info`, `error`。通过`type`字段来设置,除此以外的值将被忽略。同时,我们也为 Notification 的各种 type 注册了方法,可以在不传入`type`字段的情况下像`open5`和`open6`那样直接调用。
|
||||
```html
|
||||
<template>
|
||||
<el-button
|
||||
|
@ -158,18 +156,16 @@
|
|||
},
|
||||
|
||||
open5() {
|
||||
this.$notify({
|
||||
this.$notify.info({
|
||||
title: '消息',
|
||||
message: '这是一条消息的提示消息',
|
||||
type: 'info'
|
||||
message: '这是一条消息的提示消息'
|
||||
});
|
||||
},
|
||||
|
||||
open6() {
|
||||
this.$notify({
|
||||
this.$notify.error({
|
||||
title: '错误',
|
||||
message: '这是一条错误的提示消息',
|
||||
type: 'error'
|
||||
message: '这是一条错误的提示消息'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -190,7 +186,7 @@ Element 为 `Vue.prototype` 添加了全局方法 `$notify`。因此在 vue inst
|
|||
import { Notification } from 'element-ui';
|
||||
```
|
||||
|
||||
此时调用方法为 `Notification(options)`。
|
||||
此时调用方法为 `Notification(options)`。我们也为每个 type 定义了各自的方法,如 `Notification.success(options)`。
|
||||
|
||||
### Options
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
||||
|
|
|
@ -30,6 +30,18 @@ var Message = function(options) {
|
|||
instances.push(instance);
|
||||
};
|
||||
|
||||
['success', 'warning', 'info', 'error'].forEach(type => {
|
||||
Message[type] = options => {
|
||||
if (typeof options === 'string') {
|
||||
options = {
|
||||
message: options
|
||||
};
|
||||
}
|
||||
options.type = type;
|
||||
return Message(options);
|
||||
};
|
||||
});
|
||||
|
||||
Message.close = function(id, userOnClose) {
|
||||
for (let i = 0, len = instances.length; i < len; i++) {
|
||||
if (id === instances[i].id) {
|
||||
|
|
|
@ -32,6 +32,18 @@ var Notification = function(options) {
|
|||
instances.push(instance);
|
||||
};
|
||||
|
||||
['success', 'warning', 'info', 'error'].forEach(type => {
|
||||
Notification[type] = options => {
|
||||
if (typeof options === 'string') {
|
||||
options = {
|
||||
message: options
|
||||
};
|
||||
}
|
||||
options.type = type;
|
||||
return Notification(options);
|
||||
};
|
||||
});
|
||||
|
||||
Notification.close = function(id, userOnClose) {
|
||||
let index;
|
||||
let removedHeight;
|
||||
|
|
Loading…
Reference in New Issue