tonghoai / vue-markdown-editor

A markdown editor built on Vue

Home Page:https://code-farmer-i.github.io/vue-markdown-editor/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Markdown Editor built on Vue

Downloads Version License

Links

Communication

qq group: 798884474

Install

# Vue 2 use npm
npm i @kangc/v-md-editor -S
# Vue 2 use yarn
yarn add @kangc/v-md-editor

# Vue 3 use npm
npm i @kangc/v-md-editor@next -S
# Vue 3 use yarn
yarn add @kangc/v-md-editor@next

Quick Start

import Vue from 'vue';
import VueMarkdownEditor from '@kangc/v-md-editor';
import '@kangc/v-md-editor/lib/style/base-editor.css';
import vuepressTheme from '@kangc/v-md-editor/lib/theme/vuepress.js';
import '@kangc/v-md-editor/lib/theme/style/vuepress.css';

VueMarkdownEditor.use(vuepressTheme);

Vue.use(VueMarkdownEditor);

Quick Start In Vue3

import { creatApp } from 'vue';
import VMdEditor from '@kangc/v-md-editor';
import '@kangc/v-md-editor/lib/style/base-editor.css';
import vuepressTheme from '@kangc/v-md-editor/lib/theme/vuepress.js';
import '@kangc/v-md-editor/lib/theme/style/vuepress.css';

VMdEditor.use(vuepressTheme);

const app = creatApp(/*...*/);

app.use(VMdEditor);

Usage

<template>
  <v-md-editor v-model="text" height="400px"></v-md-editor>
</template>

<script>
  export default {
    data() {
      return {
        text: '',
      };
    },
  };
</script>

Usage Composition Api

<template>
  <v-md-editor v-model="text" height="400px"></v-md-editor>
</template>

<script>
  import { ref } from 'vue';

  export default {
    setup() {
      const text = ref('');

      return {
        text,
      };
    },
  };
</script>

Sponsor

Paypal

PayPal.Me

Alipay 支付宝

WeChat Pay 微信

Refrence

License

MIT

About

A markdown editor built on Vue

https://code-farmer-i.github.io/vue-markdown-editor/

License:MIT License


Languages

Language:JavaScript 59.3%Language:Vue 23.3%Language:CSS 15.9%Language:SCSS 0.8%Language:HTML 0.8%