@aburai/vue-highlight
v1.0.3
Published
Vue plugin to highlight text.
Downloads
5
Readme
vue-highlight
UNDER CONSTRUCTION - use at own risc and create issues
Introduction
vue-highlight
is a plugin for Vue.js. Features include:
- options for finetuning (see default options)
- option for debugging (logs highlighting workflow)
Install
From npm:
$ npm install @aburai/vue-highlight --save
$ yarn add @aburai/vue-highlight
Usage
append plugin to Vue
import Vue from 'vue'
import VueHighlight from '@aburai/vue-highlight'
Vue.use(VueHighlight)
default options
{
wordsOnly: false,
caseSensitive: false,
notGlobal: true,
defaultSelector: 'div',
nodeName: 'span',
className: 'v-highlight',
classNameStopWord: 'v-highlight v-highlight--stopword',
ignore: 'v-highlight--ignore',
splitter: [',', '/'],
debug: false
}
use plugin
onInput(value) {
this.$highlight(value, 'td', {
wordsOnly: false,
caseSensitive: false,
notGlobal: true
})
}
.v-highlight {
padding: 0 1px;
font-size: 105%;
font-weight: 500;
color: #000;
background: yellow;
&.v-highlight--stopword {
background: red;
}
}
License
Copyright (c) 2019-present André Bunse (aburai)
Special Thanks
to vue-router as a boilerplate for a good vue plugin template