Taro微信小程序可以用wxParse来达到html转换wxml的效果:https://github.com/NervJS/taro-components-test/blob/master/src/pages/wxParse/wxParse.js

import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image, Button } from '@tarojs/components'
import WxParse from '../../wxParse/wxParse'
import "../../wxParse/wxParse.wxss"; class Home extends Component { constructor() {
super(...arguments);
this.state = ({ })
} config = {
navigationBarTitleText: '首页'
} componentWillMount() { }
componentDidMount() {
const article = '<div style="color: red">我是HTML代码</div><h2>标题2</h2><img src="http://192.168.122.142:80/public/1904/26/public-1904-26-c15d9fb7-0ad5-40a9-b845-6d085d6c0f30.jpg">'
WxParse.wxParse('article', 'html', article, this.$scope, )
} render() {
return (
<View className="home">
<import src='../../wxParse/wxParse.wxml' />
<template is='wxParse' data='{{wxParseData:article.nodes}}'/>
</View> )
}
} export default Home

Taro -- 微信小程序wxParse达到html转换wxml的更多相关文章

  1. Taro -- 微信小程序登录

    Taro微信小程序登录 1.调用Taro.login()获取登录凭证code: 2.调用Taro.request()将code传到服务器: 3.服务器端调用微信登录校验接口(appid+appsecr ...

  2. 微信小程序笔记<七>视图层 —— wxml

    微信小程序的视图层由 *.wxml 组成,wxml与html一样属于标签语言,但wxml与html的标签截然不一样. xwml特性 一.数据绑定 <!--wxml--> <view& ...

  3. 微信小程序——wxParse使用方法

    wxParse是一个微信小程序富文本解析组件.现在小程序里面自带了一个<rich-text>组件也能解析富文本,但是表现不尽人意.所以我还是采用的wxParse来解析富文本的. wxPar ...

  4. Taro 微信小程序 上传文件到minio

    小程序前端上传文件不建议直接引用minio的js npm包,一来是这个包本身较大,会影响小程序的体积,二来是ak sk需要放到前端存储,不够安全,因此建议通过请求后端拿到签名数据后上传. 由于小程序的 ...

  5. 钉钉/支付宝小程序和微信小程序的区别及转换方案

    最近接到一个工作任务,是把钉钉小程序转微信小程序... 对,居然还有这种操作,之前只听过微信小程序转支付宝小程序的,钉钉转微信是什么鬼

  6. taro 微信小程序原生作用域获取

    在 Taro 的页面和组件类中,this 指向的是 Taro页面或组件实例. 但是一般我们需要获取 Taro的页面和组件 所对应的 小程序原生页面和组件实例,这个时候我们可以通过 this.$scop ...

  7. 微信小程序 wxParse插件显示视频

    修改wxParse/html2json.js 文件 ,在 html2json(html, bindName) 方法里 var node = { node: 'element', tag: tag, } ...

  8. Taro -- 微信小程序密码弹窗

    记录一个类似支付密码的弹窗写法,实现是否免密功能.如图: index.js   import Taro, { Component } from '@tarojs/taro'   import { Vi ...

  9. Taro/微信小程序解析XML

    npm i xmldom PS: https://www.npmjs.com/package/xmldom https://blog.csdn.net/caojie1008/article/detai ...

随机推荐

  1. CodeForces 1198D 1199F Rectangle Painting 1

    Time limit 1000 ms Memory limit 262144 kB 解题思路 一堆循环嵌套的那种dp,不好想.但是可以搜啊,很暴力的.记忆化一下就好. 我们定义搜索函数\(\text{ ...

  2. #1123-JSP隐含对象

    JSP 隐含对象 JSP隐含对象是JSP容器为每个页面提供的Java对象,开发者可以直接使用它们而不用显式声明.JSP隐含对象也被称为预定义变量. JSP所支持的九大隐含对象: 对象,描述 reque ...

  3. Spring Cloud教程(十二)加密和解密

    Spring Cloud具有一个用于在本地解密属性值的Environment预处理器.它遵循与Config Server相同的规则,并通过encrypt.*具有相同的外部配置.因此,您可以使用{cip ...

  4. 登陆一个系统时,前端js实现的验证,记住密码等功能

    记住密码部分: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <m ...

  5. [CSP-S模拟测试]:连连看(图论+容斥)

    题目传送门(内部题74) 输入格式 输入文件$link.in$ 第一行三个整数$n,m,k$,之间用空格隔开,$n,m$表示地图行数和列数,$k$表示每个方块周围相邻的位置(至多有$4$个,至少有$2 ...

  6. JS判断Android、iOS或浏览器的多种方法(四种方法)

    第一种:通过判断浏览器的userAgent,用正则来判断是否是ios和Android客户端. 代码如下: <script type="text/javascript"> ...

  7. Oracle诊断: 服务器启后,无法连接

    Oracle 服务器启后,使用Toad 客户端连接oracle 时候,遇到下面的错误: oracle ORA-12514: TNS: no listener TNS: listener does no ...

  8. React-Native 之 GD (八)GET 网络请求封装

    1.到这里,相信各位对 React-Native 有所熟悉了吧,从现在开始我们要慢慢往实际的方向走,这边就先从网络请求这部分开始,在正式开发中,网络请求一般都单独作为一部分,我们在需要使用的地方只需要 ...

  9. Vue知识整理5:v-bind绑定属性(Class 与 Style 绑定)

    通过v-bind实现Class 与 Style 绑定,方便调整属性的值

  10. Java-小技巧-006 List 排序 Collections.sort()

    一.数组操作类:Arrays 最早开始使用,查看方法二分查找:public static int binarySearch(数据类型[] a, 数据类型 key) 前提是有序的 equals 先排序 ...