小程序解析后端返回的html格式数据
先看数据格式:
大概就这个样子,首先我们引入一个组件:wxParse
git地址:https://github.com/icindy/wxParse,下载完后把wxParse里的wxParse文件夹放好,比如utils等看个人习惯
1、先到需要使用的页面wxss里面引入样式(教程很多都是在全局的app.wxss看个人咯,怕影响到其他页面的样式还是个别引入)
@import "../../utils/wxParse/wxParse.wxss";
2、到需要用到的js文件里引入
var WxParse = require('../../utils/wxParse/wxParse.js');
3、通过调用WxParse.wxParse方法来设置html内容
/**
* WxParse.wxParse(bindName , type, data, target,imagePadding)
* 1.bindName绑定的数据名(必填)
* 2.type可以为html或者md(必填)
* 3.data为传入的具体数据(必填)
* 4.target为Page对象,一般为this(必填)
* 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
*/Page({data: {},onLoad: function () {//content其实就是你的req得到的html数据var that = this, content= "<p class="p" style="font-size:13.3333px;text-indent:24pt;background:#FFFFFF;"><span style="font-family:"font-size:24px;">在移动互联网快速发展的今天,现代智慧城市建设离不开互联网和大数据。安防行业相关专家表示,助力城市建设,安防行业也要加速行业转型,进一步拥抱互联网技术。</span>
</p>
<p class="p" style="font-size:13.3333px;text-indent:24pt;background:#FFFFFF;"><span style="font-family:"font-size:24px;"><span style="font-family:"font-size:24px;">在日前由中安信联科技有限公司主办的安防行业全新产业生态布局暨战略合作签约新闻发布会上,中国城市科学研究会智慧城市联合实验室首席科学家万碧玉表示,目前国家积极鼓励发展智慧城市,加强城市供水供气供电、公交和防洪防涝设施等建设,深入推进新型城镇化,打造智慧城市以改善人居环境,最终使人民生活得更安心更舒心。</span></span>
</p>
<p><span style="font-size:24px;"></span>
</p>";WxParse.wxParse('content', 'html', content, that,0);}
})
4、然后到你的wxml界面里面引入,其中content.nodes里的content就是你第3步时候的bindName
<import src="../../wxParse/wxParse.wxml"/>
<template is="wxParse" data="{{wxParseData:content.nodes}}"/>
图片也能,没试过
小程序解析后端返回的html格式数据相关推荐
- swift:使用NSJSONSerialization和SwiftyJSON两种方法解析网络返回的json格式数据
在我的博客(下面)两个实验的基础上,使用NSJSONSerialization和SwiftyJSON两种方法解析网络返回的json格式数据,参照视频实现的"天气信息"小实验 1 创 ...
- 微信小程序渲染后端返回的图片
ps: 最近因为小程序登录需要验证码验证,所以去研究了一波,微信小程序如何渲染后端返回来的图片 回去重新看了一下微信小程序开发文档 发现可以利用wx.request+wx.arrayBufferToB ...
- 微信小程序 - 根据后端返回的唯一 ID / code,生成 “唯一“ 的推荐码、邀请码、订单号、加密路由、一串英文+数字长字符等 (支持反序列化原 ID 解码,逆向得出 ID 二者互转)wechat
前言 如果您需要该功能其他版本的文章,请选择:uni-app | Vue.js / Nuxt.js | JavaScript 例如,您有一个 id 或 code(任何数值),想将其变成一串 唯一的一串 ...
- 微信小程序PHP文件建在哪里,微信小程序解析H5文件方法
经常有网友问怎么让微信小程序解析H5文件或者类似封装H5网页到APP里面?我一开始觉得这是不可能的,因为官方的解答是这样的: 每一个小程序页面是由同路径下同名的四个不同后缀文件的组成,如:index. ...
- 微信小程序与后端交互(ssm)
2020-5-18更新 最近因为要用微信小程序和java后端(ssm框架)做一个云笔记的软件,因为刚刚接触小程序,在网上查了许多资料.首先,看视频学了点小程序中wxml.js.wxss.json这些类 ...
- iOS富文本解析html图片,小程序解析html和富文本编辑内容【亲测有效】
首先去 https://github.com/icindy/wxParse 下载wxParse,只拷贝wxParse文件夹即可. 1.引入wxss @import "../../util/w ...
- 微信小程序前后端数据交互
目录 一 微信小程序发送请求 二 后端接口接受小程序请求并返回数据 三 最后的效果图 先简单说一下我写的这个危险小程序前后端交互的业务,主要是两个数据:supplyCount和wantBuyCount ...
- 十分钟上线 - 函数计算构建支付宝小程序的后端
阿里云函数计算服务(FunctionCompute,FC)是一个事件驱动的全托管计算服务.通过函数计算与云端各个服务的广泛集成,开发者只需要编写函数代码,就能够快速地开发出弹性高可用的后端系统.接下来 ...
- 微信小程序前后端交互案例
微信小程序前后端交互案例 首先声明一下,本人也是一个初学者(下面的案例可能会有很多不完整或说的不正确的,所以只能起到参考作用,千万不要拿我的话当标准). 我是纯自学,之前在前后端交互方面一直搞不懂,所 ...
最新文章
- 妙用 background 实现花式文字效果
- HttpOperater
- 局部特征检测器和描述符
- java.io.file()_Java IO File (一)
- html的div块float后宽度无效,行内元素(例如)设置float之后才能用width调整宽度...
- 锐龙版和linux有什么区别,华为MateBook D 14锐龙版Linux版价格为何这么便宜
- Linux命令之乐--iconv
- windows下virtualenv中安装MySQL-python
- uniapp 小程序生成二维码 (兼容H5、微信小程序)
- 目标识别—SSD网络详解
- 大功率锂电池组BMS(电池管理系统)保护板电路介绍(ACS758/CH704应用案例)
- 用户登录+页面跳转+后台首页实现
- linux 命令:userdel 详解
- 二维几何图形创作方法(Geometry2D)
- Unity Profiler
- js 导出word文档
- 大学计算机与应用软件,第5章 应用软件与常用办公软件 大学计算机基础简明教程[最新].doc...
- Python爬虫:正则表达式?就这
- 锐龙r97900参数 r9 7900功耗 r9 7900核显性能
- Vmware16安装(详细)