other / mew-iview

Commit a87597bfe77cd5d2fc39f1b528ae7cf1b5bc14a8

Authored by Aresn
Committed by GitHub
2 parents e1b86bcf a77eaa5c

Merge pull request #1883 from iview/pr/1789 

Pr/1789
Showing 2 changed files with 19 additions and 8 deletions   Show diff stats
Inline Side-by-side
examples/routers/message.vue
  Show/Hide comments   View file @a87597b
@@ -22,7 +22,10 @@ @@ -22,7 +22,10 @@
22 }) 22 })
23 }, 23 },
24 success () { 24 success () {
25 - this.$Message.success('这是一条成功的提示'); 25 + this.$Message.success({
  26 + content: '这是一条成功的提示',
  27 + duration: 4
  28 + });
26 }, 29 },
27 warning () { 30 warning () {
28 this.$Message.warning('这是一条警告的提示'); 31 this.$Message.warning('这是一条警告的提示');
@@ -33,6 +36,12 @@ @@ -33,6 +36,12 @@
33 destroy () { 36 destroy () {
34 this.$Message.destroy(); 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 </script> 47 </script>
src/styles/components/message.less
  Show/Hide comments   View file @a87597b
@@ -8,12 +8,14 @@ @@ -8,12 +8,14 @@
8 width: 100%; 8 width: 100%;
9 top: 16px; 9 top: 16px;
10 left: 0; 10 left: 0;
  11 + pointer-events: none;
11 12
12 &-notice { 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 &-close { 20 &-close {
19 position: absolute; 21 position: absolute;
@@ -29,14 +31,14 @@ @@ -29,14 +31,14 @@
29 } 31 }
30 32
31 &-notice-content { 33 &-notice-content {
32 - position: relative;  
33 - right: 50%; 34 + display: inline-block;
  35 + pointer-events: all;
34 padding: 8px 16px; 36 padding: 8px 16px;
35 //border: 1px solid @border-color-split; 37 //border: 1px solid @border-color-split;
36 border-radius: @border-radius-small; 38 border-radius: @border-radius-small;
37 box-shadow: @shadow-base; 39 box-shadow: @shadow-base;
38 background: #fff; 40 background: #fff;
39 - display: block; 41 + position: relative;
40 &-text{ 42 &-text{
41 display: inline-block; 43 display: inline-block;
42 } 44 }