代码拉取完成,页面将自动刷新
同步操作将从 smallwei/avue-doc 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
当问题太多时可以只展示部分,后面省略显示 :::tip 1.0.4+ ::::
:::demo
<avue-text-ellipsis :text="text" :height="50" :width="200">
<small slot="more">...</small>
</avue-text-ellipsis>
<script>
export default {
data() {
return {
text: "《华盛顿自由灯塔报》几天前报道称,美国国防部官员透露中国近日进行第十次东风-41洲际导弹的试射活动,这次试射中东风-41导弹投射了多个弹头并成功命中中国西部靶场目标。"
}
}
}
</script>
:::
:::demo
<avue-text-ellipsis :text="text" :height="100" :width="200">
<small slot="more">...</small>
<el-tag slot="before" size="small">new</el-tag>
<small slot="after">[09/14]</small>
</avue-text-ellipsis>
<script>
export default {
data() {
return {
text: "《华盛顿自由灯塔报》几天前报道称,美国国防部官员透露中国近日进行第十次东风-41洲际导弹的试射活动,这次试射中东风-41导弹投射了多个弹头并成功命中中国西部靶场目标。"
}
}
}
</script>
:::
:::demo
<avue-text-ellipsis :text="text" :height="100" :width="200" :is-limit-height="isLimitHeight" @show="show"
@hide="hide">
<el-tag slot="before" size="small">new</el-tag>
<small slot="more"><span>...</span><span class="link" @click="isLimitHeight=false">查看更多</span></small>
<small slot="after" class="link" v-if="!isLimitHeight" @click="isLimitHeight=true">收起</small>
</avue-text-ellipsis>
<script>
export default {
data() {
return {
text: "《华盛顿自由灯塔报》几天前报道称,美国国防部官员透露中国近日进行第十次东风-41洲际导弹的试射活动,这次试射中东风-41导弹投射了多个弹头并成功命中中国西部靶场目标。",
isLimitHeight: true
}
}
}
</script>
:::
:::demo
<avue-text-ellipsis :key="text" :text="text" :height="40" :width="200" use-tooltip placement="top">
<small slot="more">...</small>
</avue-text-ellipsis>
<script>
export default {
data() {
return {
text: "《华盛顿自由灯塔报》几天前报道称,美国国防部官员透露中国近日进行第十次东风-41洲际导弹的试射活动,这次试射中东风-41导弹投射了多个弹头并成功命中中国西部靶场目标。"
}
},
methods: {
show() {
this.$message.success('show');
},
hide() {
this.$message.success('hide')
}
}
}
</script>
:::
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
text | 需要省略的文本 | String | - | - |
width | 限制的宽 | Number | - | - |
height | 限制的高 | Number | - | - |
is-limit-height | 是否开启限制 | Boolean | - | true |
use-tooltip | 是否使用tooltip | Boolean | - | false |
placement | tooltip的placement | String | - |
事件名 | 说明 | 参数 |
---|---|---|
show | 当isLimitHeight为true,文本全部展示的时候 | - |
hide | 当isLimitHeight为true,文本省略的时候 | - |
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。