import Vue from 'vue';
import { Notify } from 'vant';
Vue.use(Notify);
Notify('Notify Message');
Notify({ type: 'primary', message: 'Notify Message' });
Notify({ type: 'success', message: 'Notify Message' });
Notify({ type: 'danger', message: 'Notify Message' });
Notify({ type: 'warning', message: 'Notify Message' });
Notify({
message: 'Custom Color',
color: '#ad0000',
background: '#ffe1e1'
});
Notify({
message: 'Custom Duration',
duration: 1000
});
After import the Notify component, the $notify method is automatically mounted on Vue.prototype, making it easy to call within a vue component.
export default {
mounted() {
this.$notify('Notify Message');
}
}
Methods |
Attribute |
Return value |
Description |
Notify |
`options |
message` |
notify instance |
Notify.clear |
- |
void |
Close notify |
Notify.setDefaultOptions |
options |
void |
Set default options of all notifies |
Notify.resetDefaultOptions |
- |
void |
Reset default options of all notifies |
Attribute |
Description |
Type |
Default |
Version |
type |
Can be set to primary info warning |
string |
danger |
2.1.6 |
message |
Message |
string |
- |
- |
duration |
Duration(ms), won't disappear if value is 0 |
number |
3000 |
- |
color |
Message color |
string |
#fff |
|
background |
Background color |
string |
- |
- |
className |
Custom className |
any |
- |
- |
onClick |
Callback function after click |
Function |
- |
- |
onOpened |
Callback function after opened |
Function |
- |
- |
onClose |
Callback function after close |
Function |
- |
- |