Commit a87597bfe77cd5d2fc39f1b528ae7cf1b5bc14a8

Authored by Aresn
Committed by GitHub
2 parents e1b86bcf a77eaa5c

Merge pull request #1883 from iview/pr/1789

Pr/1789
examples/routers/message.vue
... ... @@ -22,7 +22,10 @@
22 22 })
23 23 },
24 24 success () {
25   - this.$Message.success('这是一条成功的提示');
  25 + this.$Message.success({
  26 + content: '这是一条成功的提示',
  27 + duration: 4
  28 + });
26 29 },
27 30 warning () {
28 31 this.$Message.warning('这是一条警告的提示');
... ... @@ -33,6 +36,12 @@
33 36 destroy () {
34 37 this.$Message.destroy();
35 38 }
  39 + },
  40 + mounted () {
  41 + this.$Message.config({
  42 + top: 50,
  43 + duration: 3
  44 + });
36 45 }
37 46 }
38 47 </script>
... ...
src/styles/components/message.less
... ... @@ -8,12 +8,14 @@
8 8 width: 100%;
9 9 top: 16px;
10 10 left: 0;
  11 + pointer-events: none;
11 12  
12 13 &-notice {
13   - width: auto;
14   - vertical-align: middle;
15   - position: absolute;
16   - left: 50%;
  14 + padding: 8px;
  15 + text-align: center;
  16 + &:first-child {
  17 + margin-top: -8px;
  18 + }
17 19  
18 20 &-close {
19 21 position: absolute;
... ... @@ -29,14 +31,14 @@
29 31 }
30 32  
31 33 &-notice-content {
32   - position: relative;
33   - right: 50%;
  34 + display: inline-block;
  35 + pointer-events: all;
34 36 padding: 8px 16px;
35 37 //border: 1px solid @border-color-split;
36 38 border-radius: @border-radius-small;
37 39 box-shadow: @shadow-base;
38 40 background: #fff;
39   - display: block;
  41 + position: relative;
40 42 &-text{
41 43 display: inline-block;
42 44 }
... ...