微信小程序集成Markdown

使用第三方库 wemark,GitHub 地址:https://github.com/TooBug/wemark

集成步骤

1、下载 wemark 并拷贝到小程序根目录

2、WXML 引入模板

1
2
3
4
5
6
<import src="../../wemark/wemark.wxml" />

<view class="article">
<!-- data中的参数和上方确定的数据名称保持一致 -->
<template is="wemark" data="{{...wemark}}"></template>
</view>

3、WXSS 引用样式

1
@import '/wemark/wemark.wxss';

4、js 部分

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// pages/markdown/markdown.js
var wemark = require('../../wemark/wemark.js')
Page({

/**
* 页面的初始数据
*/
data: {
// 确定一个数据名称
wemark: {},
},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var content = '# APP开发技术博客\n' +
'1. 博客:[http://www.appblog.cn/](http://www.appblog.cn/)\n' +
'2. 标签:Android/iOS/微信/PHP/前端/运维';
wemark.parse(content, this, {
name: 'wemark'
})
},
})

OK,示例完成,请求接口,将 content 换成真实数据即可。

Powered by AppBlog.CN     浙ICP备14037229号

Copyright © 2012 - 2020 APP开发技术博客 All Rights Reserved.

访客数 : | 访问量 :