online-vue-editor

short description + sample image(png/gif/mp4)

Table of Contents

• Introduction
• Features
• Install
• Usage
• Links
• Contributing
• Contributors
• License

Introduction

本插件为 vue-live 的一个 layout 皮肤

即组件使用方式可以参考或者使用原仓库

引用 layout 可以引用本插件

⬆ Back to Top

Features

⬆ Back to Top

Install

npm i "online-vue-editor"

⬆ Back to Top

Usage

不安装 vue-live 使用, 全局安装

import Vue from 'vue'
import OnlineVueEditor from 'online-vue-editor'

Vue.use(OnlineVueEditor)

不安装 vue-live 使用, 局部安装

<template>
  <online-vue-editor :code="code" />
</template>

<script>
import OnlineVueEditor from 'online-vue-editor'

export default {
  components: {
    OnlineVueEditor
  },
  data() {
    return {
      code: `<input type='button' value='I am ccc' />`
    }
  }
}
</script>

安装 vue-live ，使用本库作为 layout 引入 -- 推荐

此种方式可以不受限于此库享受 vue-live 的最新支持，所以推荐此种使用方式

<template>
  <vue-live :layout="OnlineVueLayout" :code="code" />
</template>

<script>
import {VueLive} from 'vue-live'
import {OnlineVueLayout} from 'online-vue-editor'

export default {
  components: {
    VueLive,
    OnlineVueEditor
  },
  data() {
    return {
      code: `<input type='button' value='I am ccc' />`
    }
  }
}
</script>

⬆ Back to Top

Links

• docs

⬆ Back to Top

Contributing

For those who are interested in contributing to this project, such as:

• report a bug
• request new feature
• fix a bug
• implement a new feature

Please refer to our contributing guide.

⬆ Back to Top

Contributors

Thanks goes to these wonderful people (emoji key):

This project follows the all-contributors specification. Contributions of any kind welcome!

⬆ Back to Top

License

MIT

⬆ Back to Top