微信小程序支持markdown語法

1.下載
https://github.com/StanleyLe/Utils 里面的 towxml.zip文件解壓縮
2.TOWXML文件夾放到小程序根目錄
3.在小程序app.js中引入庫

//app.js
const Towxml = require('/towxml/main');     //引入towxml庫
App({
    onLaunch: function () {
    },
    towxml:new Towxml()                     //創(chuàng)建towxml對象,供小程序頁面使用
})

4.在小程序頁面文件中引入模版

<!--pages/index.wxml-->

<!--引入towxml模版入口文件,并使用模版-->
<import src="/towxml/entry.wxml"/>
<template is="entry" data="{{...article}}"/>   // 三個小數(shù)點一定要帶上

5.在小程序對應的js中請求數(shù)據

// 獲取幫助手冊列表
    get_guide_list: function () {
        let self_ = this
        wx.request({
            url: globalUrl + '/wxapp/client_helper_list',
            success(res) {
                console.log(res.data)
                // 獲取到的數(shù)據 必須是字符串格式res.data.data[0].Content
                let data = app.towxml.toJson(res.data.data[0].Content, 'markdown')
                //設置文檔顯示主題,背景顏色,默認'light'
                data.theme = 'dark';  
                console.log(data, 6666666666)

                self_.setData({
                    helper_obj_list: res.data.data,
                    article: data
                })
            },
            fail: function (res) {

            }

        })
    },

6.引入對應的WXSS

/**pages/index.wxss**/

/**基礎風格樣式**/
@import '/towxml/style/main.wxss';


/**如果頁面有動態(tài)主題切換,則需要將使用到的樣式全部引入**/

/**主題配色(淺色樣式)**/
@import '/towxml/style/theme/light.wxss';

/**主題配色(深色樣式)**/
@import '/towxml/style/theme/dark.wxss';
  1. 完成?。。。?/li>
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容