相信開發太小程序的人都知道小程序不支持直接插入dom,那麼當咱們獲取到markdown數據須要渲染的時候就有麻煩。vue
封裝好的mpvue-wemark地址git
所以github上有不少成熟的小程序markdown渲染方案,可是本身以前寫mpvue的時候發如今mpvue上直接用這些庫是不行的,由於wxml和vue的寫法上是不兼容的,所以就須要對mpvue進行適配。這裏我選擇wemark這個庫。github
主要作了幾步 :一、把remarkable.js從新打包成ES版本,mpvue默認腳手架是wepack2不支持es commonjs混用 二、把wxml和小程序js層不兼容vue的寫法兼容了下。小程序
demo以下bash
<template>
<div>
<wemark :mdData='mdData'/>
</div>
</template>
<script>
import wemark from "mpvue-wemark";
export default {
data() {
return {
mdData: ''
};
},
components: {
wemark
},
mounted() {
this.mdData = "## hello, world";
}
};
</script>
複製代碼
這樣,就實現了在mpvue小程序中渲染出markdown的內容了markdown