Package Exports
- vue-filters
- vue-filters/notPrevented
- vue-filters/prevent
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue-filters) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
vue-filters
A collection of filters for vue.
Policy
all sorts of filters can be submitted. There will be no removes because of deprecation. If the API of a filter changes, the name has to change.
Install
npm install --save-dev vue-filtersor include bundle.js
Usage
## whithin your module
components:
filters:
escape: require("vue-filters/escape")
# if you have used the bundle.js
components:
filters:
escape: window.vueFilters.escapeList of filters
| Name | arguments | description |
|---|---|---|
| escape | string | turns &,< and > to &, < and > (usage raw html) |
| nl2br | string | turns \n to <br> (usage raw html) |
| byObject | array, object | only entries in the array matching all keys and values of the provided object will be included |
| notPrevented | function | only call function when event.defaultPrevented is false |
| prevent | function | call function and call event.preventDefault() afterwards |
Detailed usage
byObject
<div v-for="entry in array | byObject {name:'john',age:'24'}">
// dynamic
<div v-for="entry in array | byObject {name:{{filtername}},age:{{filterage}}}">
// or just pass an object from your Vue instance
<div v-for="entry in array | byObject someFilterObject">notPrevented
read: https://css-tricks.com/dangers-stopping-event-propagation/
// when clicked on the child, parentClick won't be called
<div @click="parentClick | notPrevented"><div @click.prevent="childClick"></div></div>
prevent
read: https://css-tricks.com/dangers-stopping-event-propagation/
// won't work
<div @click.prevent="onClick | notPrevented"></div>
// will work
<div @click="onClick | notPrevented | prevent"></div>Develop
Clone rep
npm installAvailable scripts:
npm run build # compiles coffee-script in src/
npm run test # runs a single-run karma in chrome and firefox
npm run watch # runs karma in chrome (uses src/*.coffee files direclty, no need for build)
# to run only single tests:
karma start --browsers Chrome --auto-watch --reporters spec --files ['test/onClick.coffee']License
Copyright (c) 2015 Paul Pflugradt Licensed under the MIT license.