@sparing-software/v-clamp
Vue directive plugin for text truncate
3,655
15
| Install | |
|---|---|
npm install @sparing-software/v-clamp |
|
| Latest Version: | 1.0.1 |
| License: | MIT |
| Last Updated: | Jan 4, 2023 |
| Links: | GitHub · npm |
Maintainer: vladyslavprosolupovsparing
V-clamp :speech_balloon:
Vue directive plugin for text truncate. Plugin cuts too long text and replace it with ellipsis.

How to use
Installation
Install package in your project
$ npm install @sparing-software/v-clamp
Configuration
Basic config in Vue app by global import plugin in main.js file
import Clamp from '@sparing-software/v-clamp'
Vue.use(Clamp)
Implementation
All you need to do is add v-clamp directive to element on which you want to ellipsis overflow and specify its height or max-height style property.
Look at the example below:
<template>
<p v-clamp class="text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
</template>
<style>
.text {
max-height: 100px;
}
</style>
Contributing
Want to help improve this plugin? Great!
Project is open-source so fork repo and join us!
License
MIT License © Sparing Interactive
Related Packages
vue-truncate-read-more
A Vue.js V3/2 plugin for truncating text with a 'Read More' button to expand the...
7,699
6
@miii/vue-lettering
Web typography tool for Vue to split text into pieces for CSS selection with eas...
630
10
Version History
| Version | Released | License |
|---|---|---|
| 1.0.1 | MIT | |
| 1.0.0 | MIT |