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: about 2 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
- Archived: true
- Created: 2017-11-21T11:15:58.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2021-08-17T04:26:57.000Z (over 3 years ago)
- Last Synced: 2024-10-11T10:42:09.693Z (2 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
[![License](https://img.shields.io/github/license/mazipan/vue-string-filter.svg?maxAge=3600)](https://github.com/mazipan/vue-string-filter) ![minified](https://badgen.net/bundlephobia/minzip/vue-string-filter) [![version](https://img.shields.io/npm/v/vue-string-filter.svg)](https://www.npmjs.com/package/vue-string-filter) [![downloads](https://img.shields.io/npm/dt/vue-string-filter.svg)](https://www.npmjs.com/package/vue-string-filter) [![Travis](https://img.shields.io/travis/mazipan/vue-string-filter.svg)](https://travis-ci.org/mazipan/vue-string-filter) [![codecov](https://codecov.io/gh/mazipan/vue-string-filter/branch/master/graph/badge.svg)](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