diff --git a/components/toast/README.en-US.md b/components/toast/README.en-US.md index e62ecc2d..89c9da70 100644 --- a/components/toast/README.en-US.md +++ b/components/toast/README.en-US.md @@ -29,7 +29,7 @@ Dynamically create a toast |----|-----|------|------|------| | icon | name of icon | String | - | refer to `Icon` component for customized icons| | iconSvg | use svg icon | Boolean | `false` |-| -| content | content of message| String/Number | - |- | +| content | content of message| String/Number | - | content supports two lines display 2.7.1+ | | duration | toast will be closed in milliseconds; if set duration as`0`, the toast will always be visible | Number | `3000` | - | | position | display position | String | `center` | `top/center/bottom` | | hasMask | whether to show a transparent mask, which will prevent users from clicking| Boolean | `false` | - | diff --git a/components/toast/README.md b/components/toast/README.md index 300ea2fb..f3ea782a 100644 --- a/components/toast/README.md +++ b/components/toast/README.md @@ -31,7 +31,7 @@ Vue.component(Toast.component.name, Toast.component) // 组件引入 |----|-----|------|------|------| | icon | Icon组件图标名称 | String | - |如需自定义图标, 请查看`Icon`组件 | | iconSvg | 使用svg图标 | Boolean | `false` |-| -| content | 提示内容文本 | String | - |- | +| content | 提示内容文本 | String | - |内容支持2行展示 2.7.1+| | duration | 显示多少毫秒后自动消失, 若为`0`则一直显示 | Number | `3000` | - | | position | 展示位置 | String | `center` | `top/center/bottom` | | hasMask | 是否显示透明遮罩, 以此防止用户点击 | Boolean | `false` | - | diff --git a/components/toast/toast.vue b/components/toast/toast.vue index 013fa40f..749966eb 100644 --- a/components/toast/toast.vue +++ b/components/toast/toast.vue @@ -132,7 +132,7 @@ export default { .md-toast-content display inline-flex - align-items center + align-items flex-start max-width 100% min-width 80px padding toast-padding @@ -145,12 +145,15 @@ export default { box-sizing border-box overflow hidden .md-toast-text - white-space nowrap - text-overflow: ellipsis - overflow hidden + word-break break-all + white-space normal + display -webkit-box + -webkit-box-orient vertical + -webkit-line-clamp 2 &.square display flex flex-direction column + align-items center width 240px min-height 232px padding 54px 36px 48px 36px