vue-paragraph
v0.2.4
Published
1. 一个实现在文本溢出后浮现Tooltip,文本不溢出则不显示Tooltip的Vue组件;2. 还可以做文本展开收起效果
Downloads
19
Maintainers
Readme
vue-paragraph
更多API和建议,请参阅文档
npm install vue-paragraph
import Paragraph from 'vue-paragraph'
Vue.use(Paragraph)
示例: Vue 实现在文本溢出后浮现Tooltip、及文本展开收起效果;文本超出后,显示Tooltip,文本未超出,不显示Tooltip。
文本展开收起,文本溢出Tooltip,Vue,ElementUI,Tooltip
- expandable模式(默认) - 文本展开收起效果:
<Paragraph
content="使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例"
:max-lines="1"
:width="400"
/>
- tooltip模式 - 文本使用Tooltip效果:
- 文本超出后,显示Tooltip
<Paragraph
content="使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例"
:max-lines="1"
:width="400"
type="tooltip"
/>
- 文本超出后,显示Tooltip 文本未超出,不显示Tooltip
<Paragraph
content="使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例"
:max-lines="3"
:width="400"
type="tooltip"
/>
- 文本未超出,不显示Tooltip
- tooltipExpandable模式 - 文本同时使用Tooltip和展开收起效果:
<Paragraph
content="使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例使用示例"
:max-lines="1"
:width="400"
type="tooltipExpandable"
/>