✂️ Vue String Filter

Lightweight Vue filter for string manipulation

Demo

https://mazipan.github.io/vue-string-filter/

Available Filter

• uppercase
• lowercase
• capitalize
• titlecase
• slug
• truncate
• cut
• remove
• remove_first
• replace
• replace_first
• append

Download

# NPM
npm install vue-string-filter

# Yarn
yarn add vue-string-filter

Sample Usage

Use Plugins

import VueStringFilter from 'vue-string-filter'
Vue.use(VueStringFilter)

Import Individual Filters

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

<span>{{ stringWillFormatted | uppercase }}</span>
<span>{{ stringWillFormatted | lowercase }}</span>
<span>{{ stringWillFormatted | capitalize }}</span>
<span>{{ stringWillFormatted | titlecase }}</span>
<span>{{ stringWillFormatted | slug }}</span>
<span>{{ stringWillFormatted | truncate(10) }}</span>
<span>{{ stringWillFormatted | cut(10) }}</span>
<span>{{ stringWillFormatted | remove('stringToRemove') }}</span>
<span>{{ stringWillFormatted | remove_first('stringToRemove') }}</span>
<span>{{ stringWillFormatted | replace('stringToReplace') }}</span>
<span>{{ stringWillFormatted | replace_first('stringToReplace') }}</span>
<span>{{ stringWillFormatted | append('stringToAppend') }}</span>

Support me

• Via trakteer
• Direct support, send me an email

Contributing

If you'd like to contribute, head to the contributing guidelines. Inside you'll find directions for opening issues, coding standards, and notes on development.

---

Copyright © 2019 Built with ❤️ by Irfan Maulana