@mention #hashtag And URL Highlighter – vue-highlights

vue-highlights is a Vue.js component that enables @metion, #hashtag, and URL highlighting in a contenteditable element.

Basic Usage:

1. Import and register the component.

import Vue from 'vue'
import VueHighlights, { autoLink, autoHighlight } from 'vue-highlights'
Vue.component(VueHighlights.name, VueHighlights)

2. Add the component to the app template.

export default {
  name: 'MyComponent',
  data () {
    return {
      text: text

3. Available component props.

extractUrlsWithoutProtocol: {
  type: Boolean,
  default: true
caretColor: {
  type: String,
  default: '#ccc'
placeholder: {
  type: String,
  default: `What's Happening?`
value: String


Download Details:

Author: pggalaviz

Live Demo: https://pggalaviz.github.io/vue-highlights/#/

Download Link: https://github.com/pggalaviz/vue-highlights/archive/refs/heads/master.zip

Official Website: https://github.com/pggalaviz/vue-highlights

Install & Download:

# Yarn
$ yarn add vue-highlights

$ npm i vue-highlights

Add Comment