Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mazipan/vue-string-filter
✂️ Vue 2.x lightweight string manipulation filter
https://github.com/mazipan/vue-string-filter
vue vue-filter vue-string vue-string-filter vue2
Last synced: 3 months ago
JSON representation
✂️ Vue 2.x lightweight string manipulation filter
- Host: GitHub
- URL: https://github.com/mazipan/vue-string-filter
- Owner: mazipan
- License: mit
- Created: 2017-11-21T11:15:58.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2021-08-17T04:26:57.000Z (about 3 years ago)
- Last Synced: 2024-07-08T04:58:19.423Z (4 months ago)
- Topics: vue, vue-filter, vue-string, vue-string-filter, vue2
- Language: TypeScript
- Homepage: https://mazipan.github.io/vue-string-filter/
- Size: 6.77 MB
- Stars: 38
- Watchers: 3
- Forks: 6
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# :scissors: Vue String Filter
> Lightweight Vue filter for string manipulation
[](https://github.com/mazipan/vue-string-filter)  [](https://www.npmjs.com/package/vue-string-filter) [](https://www.npmjs.com/package/vue-string-filter) [](https://travis-ci.org/mazipan/vue-string-filter) [](https://codecov.io/gh/mazipan/vue-string-filter)
## Demo
[https://mazipan.github.io/vue-string-filter/](https://mazipan.github.io/vue-string-filter/)
## Available Filter
+ `uppercase`
+ `lowercase`
+ `capitalize`
+ `titlecase`
+ `slug`
+ `truncate`
+ `cut`
+ `remove`
+ `remove_first`
+ `replace`
+ `replace_first`
+ `append`
## Download
```bash
# NPM
npm install vue-string-filter
# Yarn
yarn add vue-string-filter
```
## Sample Usage
### Use Plugins
```javascript
import VueStringFilter from 'vue-string-filter'
Vue.use(VueStringFilter)
```
#### Import Individual Filters
```javascript
import Vue from 'vue'
// using named exports
import { append, capitalize, cut... } from 'vue-string-filter'
// directly
import append from 'vue-string-filter/dist/append'
import capitalize from 'vue-string-filter/dist/capitalize'
import cut from 'vue-string-filter/dist/cut'
import lowercase from 'vue-string-filter/dist/lowercase'
import remove_first from 'vue-string-filter/dist/remove-first'
import remove from 'vue-string-filter/dist/remove'
import replace_first from 'vue-string-filter/dist/replace-first'
import replace from 'vue-string-filter/dist/replace'
import slug from 'vue-string-filter/dist/slug'
import titlecase from 'vue-string-filter/dist/titlecase'
import truncate from 'vue-string-filter/dist/truncate'
import uppercase from 'vue-string-filter/dist/uppercase'
Vue.filter('append', append)
Vue.filter('capitalize', capitalize)
Vue.filter('cut', cut)
Vue.filter('lowercase', lowercase)
Vue.filter('remove_first', remove_first)
Vue.filter('remove', remove)
Vue.filter('replace_first', replace_first)
Vue.filter('replace', replace)
Vue.filter('slug', slug)
Vue.filter('titlecase', titlecase)
Vue.filter('truncate', truncate)
Vue.filter('uppercase', uppercase)
```
### Use in View
```html
{{ stringWillFormatted | uppercase }}
{{ stringWillFormatted | lowercase }}
{{ stringWillFormatted | capitalize }}
{{ stringWillFormatted | titlecase }}
{{ stringWillFormatted | slug }}
{{ stringWillFormatted | truncate(10) }}
{{ stringWillFormatted | cut(10) }}
{{ stringWillFormatted | remove('stringToRemove') }}
{{ stringWillFormatted | remove_first('stringToRemove') }}
{{ stringWillFormatted | replace('stringToReplace') }}
{{ stringWillFormatted | replace_first('stringToReplace') }}
{{ stringWillFormatted | append('stringToAppend') }}
```
## Support me
- Via [trakteer](https://trakteer.id/mazipan)
- Direct support, [send me an email](mailto:[email protected])
## Contributing
If you'd like to contribute, head to the [contributing guidelines](/CONTRIBUTING.md). Inside you'll find directions for opening issues, coding standards, and notes on development.
------
Copyright © 2019 Built with ❤️ by Irfan Maulana