关键时刻,第一时间送达!

 

最近在做小程序的时候,从github上看到了一个开源的挺不错的微信小程序组件:wxParse-微信小程序富文本解析组件 。推荐给大家使用看看!觉得有用的话,给作者加个star !

 

推荐项目| 微信小程序富文本解析组件-wxParse_h5

wxParse 支持Html及markdown转wxml可视化,下面给出了几张项目运行截图 。

 

推荐项目| 微信小程序富文本解析组件-wxParse_微信_02

 

如何使用该组件呢?

 

1、从作者的开源项目

https://github.com/icindy/wxParse

复制wxParse代码加入到我们的项目中

推荐项目| 微信小程序富文本解析组件-wxParse_公众号_03

 

2、引入必要文件

推荐项目| 微信小程序富文本解析组件-wxParse_微信_04

      3、数据绑定

推荐项目| 微信小程序富文本解析组件-wxParse_h5_05

 

上面这些是作者的项目介绍,可能这样看不是很明白怎么使用 。强烈建议自己下载项目到本地,自己运行一下程序,更直接的了解项目的使用!以下,是我自己运行的截图,看起来不是很复杂,稍微研究一下,应该能很快上手 。

 

推荐项目| 微信小程序富文本解析组件-wxParse_微信_06

 

我也稍微使用了一下,效果图如下。这边说一下,本来打算发布这个小程序的,不过由于腾讯审核的原因,个人不允许发布博客类型的小程序,所以这个小程序虽然已经完成了,却迟迟不能发布,只能当例子学习一下!

 

 

下面是关键代码,贴出来,大家一起学习一下哈!

 

var WxParse = require('../../wxParse/wxParse.js');
Page({
  data: {
  },
  onLoad: function () {
    var that = this;
  
    /**
     * html解析示例
     */
    var article = `< !DOCTYPE HTML ><!--注释: wxParse试验文本-->
      <div style="text-align:center;margin-top:20px;">
      <img src="http://www.cxyquan.com/wp-content/uploads/2018/04/2.png" alt="">
    <h2 >本小程序是基于WordPress制作完成的</h2>
  </div>

  <div style="margin-top:10px;">
    <h3 style="color: #000;">小程序声明</h3>
    <blockquote>小程序只提供对程序猿编程相关的内容,其余的都不考虑,欢迎大家投稿,一起学习!</blockquote>

    <div style="margin-top:10px;">
      <h3 style="color: #000;">如何联系</h3>
      <ul>
        <li style="color: blue;">QQ: 842546199</li>
        <li style="color: blue;">微信:18159020735</li>
        <li style="color: blue;">电话:18159020735</li>
        <li style="color: blue;">邮箱:llpdev@163.com</li>
        <li style="color: red;">商务合作:请加微信 </li>
      </ul>
    </div>
  
 <div style="margin-top:10px;">
      <h3 style="color: #000;">个人公众号</h3>
      <h5 style="margin:8px;">一个学习编程技术和读者福利共存的公众号,每天推送高质量的优秀博文和原创文章,开源项目,实用工具,面试技巧等 。 我们的目标是做到最好公众号推送平台,服务于所有的程序员开发者 。公众号每月至少准备一次读者送书福利! 欢迎关注,老铁!</h5>
      <img src="http://www.cxyquan.com/wp-content/uploads/2018/04/qrcode_for_gh_3634ff565445_258.jpg" alt="">    
  </div>    
    WxParse.wxParse('article', 'html', article, that, 5);
  }
})

 

不多说了,这篇就是给作者做宣传的(作者没联系我,个人觉得不错,顺手写了这篇文章),好的项目,应该被大家知道,大家觉得不错的,前文说了,记得给作者点个star 呀!

 

后续,大家有好的项目,可以私聊我,公众号可以给你做宣传,好的项目,不要藏着掖着!拿出来大家一起学习一下,共同进步!

 

最后,大家有兴趣学习小程序开发的,如果你不知道如何学习,建议你可以先看入门教程视频,视频可以关注下面公众号,公众号后台回复:小程序

如果你需要本文介绍的这个项目的源代码,公众号后台回复:wxParse

 

 

 

推荐项目| 微信小程序富文本解析组件-wxParse_html_07

 

程序IT圈

学习编程技术,关注这个公众号足够了

推荐项目| 微信小程序富文本解析组件-wxParse_html_08 推荐项目| 微信小程序富文本解析组件-wxParse_h5_09