基于mpvue的小程序markdown适配解决方案

相信开发太小程序的人都知道小程序不支持直接插入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

相关文章
相关标签/搜索