vue使用vue-markdown編輯框,實現簡單保存文本和html內容

安裝vue-markdown

npm install vue-markdown --save

在main.js文件中全局引用

//編輯框
import mavonEditor from 'mavon-editor'
import 'mavon-editor/dist/css/index.css'
Vue.use(mavonEditor)

vue文件使用

@save: 按下 ctrl + s 時觸發,@change: 當值發生改變時 觸發
<mavon-editor style="min-height: 600px" v-model="value"  @save="saveDoc"
              @change="updateDoc"/>
methods:{
  updateDoc(markdown, html) {
    // 此時會自動將 markdown 和 html 傳遞到這個方法中
    console.log("markdown內容: " + markdown);
    console.log("html內容:" + html);
  },
  saveDoc(markdown, html) {
    // 此時會自動將 markdown 和 html 傳遞到這個方法中
    console.log("markdown內容:" + markdown);
    console.log("html內容:" + html);
  }
}

測試結果:

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章