vue 中标题或一段文字数过长，使用用...代替的方法

Z时代
2024-01-10
分类：综合

vue

在页面中使用方法：

<li v-for="m in item.Files">
    <div style="font-size:14px;" :title="m.FileName">{{m.FileName | ellipsis}}</div>
</li>

在Vue代码中加上个过滤器：

        var vueObj = new Vue({
            el: '#feedbackList',
            data: {
                feedList:[]
            },
            methods: {
               ......
            },
            filters: {
                //文字数超出时，超出部分使用...
                ellipsis(value) {
                    if (!value) return ''
                    if (value.length > 10) {
                        return value.slice(0, 10) + '...'
                    }
                    return value
                }
            }
        })