相信開發(fā)過小程序的人都知道小程序不支持直接插入dom,那么當我們獲取到markdown數(shù)據(jù)需要渲染的時候就有麻煩。
封裝好的 mpvue-wemark 地址
因此github上有很多成熟的小程序markdown渲染方案,但是自己之前寫mpvue的時候發(fā)現(xiàn)在mpvue上直接用這些庫是不行的,因為wxml和vue的寫法上是不兼容的,因此就需要對mpvue進行適配。這里我選擇wemark這個庫。
主要做了幾步 :1、把remarkable.js重新打包成ES版本,mpvue默認腳手架是wepack2不支持es commonjs混用 2、把wxml和小程序js層不兼容vue的寫法兼容了下。
demo如下
<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>
這樣,就實現(xiàn)了在mpvue小程序中渲染出markdown的內(nèi)容了
工作日 8:30-12:00 14:30-18:00
周六及部分節(jié)假日提供值班服務