简单介绍:
wxParse 是一个 templet 组件, html 代码转化成小程序的标签, 目的是解决需要兼容手机端, 小程序端的 HTML 内容.
文件有:
html2json.JS
htmlparse.JS
showdown.JS
wxDiscode.JS
- wxParse.JS // 主入口的 JS, 和处理各种标签的事件, 如图片的 onload
- wxParse.wxml // 不同标签 template 组件, 内容会循环成 HTML 的 DOM 对象, 每个都转化成 template, 显示出来
- wxParse.wxss // 样式
使用方法:
JS 页
- // 引用
- var WxParse = require('/wxParse/wxParse.js');
- // 将需要转化的内容加上
- var that=this;
- WxParse.wxParse('Content1', 'html', 内容, that, 0);
wxml 页
<template is="wxParse" data="{{wxParseData:Content1.nodes}}"/>
wxss 页
@import "/wxParse/wxParse.wxss";
下载文件:
https://github.com/icindy/wxParse
如何给图片设置真实的宽高?
wxParse.wxml 在图片 tempate 里执行 bindonload 事件, 在 wxParse.JS 方法里, 获取它的真实宽高, 给它的 style 赋值宽高
当宽度大于屏幕宽度时, 使用屏幕宽度, 高度改为: 宽度 / 屏幕宽度 * 真实高度
最后, that.setData(bindData) 给了 template
来源: http://www.bubuko.com/infodetail-3307920.html