今天遇到个需求,需要在展示v-html的时候限制其长度并用省略号替代。记录一下
<template>
<div>
<!--这里的content是获取到的数据-->
<span v-html=""$options.filters.setContent(content)""></span>
</div>
</template>
<script>
export default{
name:'demo',
data(){
return{
content:''
}
},
methods:{},
filters: {
//当渲染的文字超出一定字节后显示省略号
setContent(value) {
if (!value) return "";
if (value.length > 300) {
return value.slice(0, 300) + "...";
}
return value;
}
}
}
</script>