Skip to content
雷小天博客微信小程序,微信小程序搜索“雷小天博客”预览
JavaScript
Branch: master
Clone or download
Latest commit 5b0c045 Jul 22, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
images update Dec 15, 2018
pages update Dec 15, 2018
utils Add files via upload Sep 8, 2017
wxParse 增加wxml转html Sep 8, 2017
LICENSE Initial commit Sep 8, 2017
README.md 修改 Jul 22, 2019
app.js Add files via upload Sep 8, 2017
app.json update Dec 15, 2018
app.wxss Add files via upload Sep 8, 2017
project.config.json update Dec 15, 2018
show.gif update Dec 15, 2018
weixin.jpg 增加公众号图片 Sep 8, 2017

README.md

雷小天博客微信小程序

支持Html及markdown转wxml可视化

版本号:1.0

来源: [雷小天博客](http://www.100txy.com)

作用: 将个人博客网站转换为微信小程序的可视化方案

特性

支持特性 实验功能 ToDo
- [x] HTML的大部分标签解析 [x] 小表情emjio [x] table标签
- [x] 内联style [x] a标签跳转
- [x] 标签Class [x] 动态添加
- [x] 图片自适应规则
- [x] 图片多图片预览
- [x] 模版层级可扩展性
- [x] 多数据循环方式
- [x] 内联style

相关截图

相关截图

基本使用方法

    1. Copy文件夹wxParse
- wxParse/
  -wxParse.js(必须存在)
  -html2json.js(必须存在)
  -htmlparser.js(必须存在)
  -showdown.js(必须存在)
  -wxDiscode.js(必须存在)
  -wxParse.wxml(必须存在)
  -wxParse.wxss(必须存在)
  -emojis(可选)
    1. 引入必要文件
//在使用的xx.js中引入WxParse模块
var WxParse = require('../../wxParse/wxParse.js');
//在使用的Wxss中引入WxParse.css,可以在app.wxss
@import "/wxParse/wxParse.wxss";
    1. 数据绑定
var article = '<div>我是HTML代码</div>';
/**
* WxParse.wxParse(bindName , type, data, target,imagePadding)
* 1.bindName绑定的数据名(必填)
* 2.type可以为html或者md(必填)
* 3.data为传入的具体数据(必填)
* 4.target为Page对象,一般为this(必填)
* 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
*/
var that = this;
WxParse.wxParse('article', 'html', article, that, 5);
    1. 模版引用
// 引入模板
<import src="你的路径/wxParse/wxParse.wxml"/>
//这里data中article为bindName
<template is="wxParse" data="{{wxParseData:article.nodes}}"/>

相关文章

捐献

来源

雷小天个人博客
个人开发

公众号

扫码预览
公众号

You can’t perform that action at this time.