Skip to content

say8425/vue-3-linkify

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

5 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

Vue 3 Linkify

NPM Test Release License

Vue 3 directive to turn URL and emails into anchor tag that use Linkify.js.

Demo vue-3-linkify

Installation

npm install --save vue-3-linkify
yarn add vue-3-linkify

Recommended to use npm or yarn to install.

Usage

Register plugin

import { createApp } from "vue"; import App from "./App.vue"; import Vue3linkify from "vue-3-linkify"; const app = createApp(App); app.use(Vue3linkify) app.mount('#app')

Use directive

<template> <div v-linkify> ... </div> </template>

Use directive with options

<template> <div v-linkify:options="{  target: '_blank',  }"> ... </div> </template>

You can use the linkify options.

Add event listener

<template> <div v-linkify:options="{  target: '_blank',  attributes: {  onclick: 'event.stopPropagation()',  },  }"> ... </div> </template>

Unfortunately, the events option is not supported in linkify.js. But you can add event listeners to attributes options manually.

About

๐ŸŒ Vue 3 directive to turn URL and emails into anchor tag that use Linkify.js

Topics

Resources

Stars

Watchers

Forks