学习的最大理由是想摆脱平庸，早一天就多一份人生的精彩；迟一天就多一天平庸的困扰。各位小伙伴，如果您：想系统/深入学习某技术知识点…一个人摸索学习很难坚持，想组团高效学习…想写博客但无从下手，急需写作干货注入能量…热爱写作，愿意让自己成为更好的人…文章目录前言一、WXML模板语法——数据绑定1、数据绑定的基本原则2、在data中定义页面的数据3、Mustache语法（差值表达式）的格式4、Mustache语法的应用场景5、动态绑定内容6、动态绑定属性7、三元运算8、算数运算二、WXML模板语法-事件绑定1、什么是事件2、小程序中常用的事件3、事件对象的属性列表4、target和currentTa

 wxml:这是一段无边距文字js:importWxml2Canvasfrom'wxml2canvas';//根据具体路径修改，node_modules会被忽略Page({drawImage1(){letself=this;this.drawImage1=newWxml2Canvas({width:340,//宽，以iphone6为基准，传具体数值，其他机型自动适配height:210,//高element:'canvas1',background:'#f0f0f0',progress(percent){},finish(url){letimgs=self.data.imgs;imgs.pus

目录前言一、条件渲染1.wx:if2.结合使用wx:if3.hidden4.wx:if与hidden的对比二、列表渲染1.wx:for2.手动指定索引和当前项的变量名*3.wx:key的使用前言    上一期我们讲解wxml模版语法中的数据绑定和事件绑定（上一期链接：微信小程序-----WXML模板语法之数据绑定与事件绑定-CSDN博客），那么本期我们继续wxml语法的学习，本期的主要内容是条件渲染和列表渲染，下面就开始本期的学习吧！一、条件渲染1.wx:if在小程序中，使用wx:if="{{condition}}"来判断是否需要渲染该代码块：{condition}}">showme也可以用w

上一篇讲了小程序框架基础，这一篇介绍WXML:小程序版HTML。1.标签与属性常用基础标签textview特征：text类似htmlspan标签行内元素，不换行；view类似htmldiv标签块级元素，换行；新建页面text类似htmlspan标签行内元素，不换行view类似htmldiv标签块级元素view类似htmldiv标签换行复制代码测试公共属性所有组件都有以下属性：2.数据绑定数据绑定功能使得程序在运行过程中,具备动态改变渲染界面的能力,从而达到了更好的用户体验效果。在WEB开发中,需要借助JavaScript并通过DOM接口来实现界面的动态更新,而在小程序中,则是使用WXML语言提

背景：商品详情页对好评数进行统计，但是现在只有商品数据使用wxs编写方法，module.exports导出，wxml中使用module名进行获取{{goodsRate.getRate(goodsInfoList)}}module.exports={getRate:function(goodsInfoList){if(!goodsInfoList||!goodsInfoList.basicInfo){return"100"}vargoodReputation=goodsInfoList.basicInfo.numberGoodReputation/goodsInfoList.basicInfo.

源代码见本文末尾~本文的代码片段用HTML语言书写，适用于网页、微信原生小程序、框架uniapp等……小程序原生开发需要实现这样一个效果。用伪类啊，这个我熟！先讲讲思路。因为用before和after的效果是一样的，所以我们任选一个，选择before。伪元素::before需要根据文本容器定位，所以给伪元素添加一个绝对定位属性position:absolute;再给文本所在容器添加一个相对定位属性position:relative;，再一个左边距，给伪元素留出位置。.xxx{ position:relative; padding-left:14px;}写伪元素的样式，这个很简单，就是一些CSS

1.原生微信小程序使用wxs1.内嵌WXS脚本2.定义外链wxs3.使用外连wxs在这里插入图片描述2.微信小程序使用vantweapp1.安装步骤2.安装包管理(package.json)文件的方法操作顺序：文档地址如果使用typescript需要操作步骤3，否则不需要操作2.1在根目录下操作npminit-y2.2安装版本yarnadd@vant/weapp@1.3.3--production//指定版本@1.3.32.3构建包->详情->勾选使用npm2.4使用vant组件

文章目录导航路线1.数据绑定的基本原则在data中定义页面的数据2.事件绑定bingtap的语法格式:在事件处理函数中为data中的数据赋值事件传参bindinput的语法格式实现文本框和data之间的数据同步1.定义数据2.渲染结构3.美化样式4.绑定input事件处理函数3.条件渲染hiddenwx:if与hidden的对比4.列表渲染手动指定索引和当前项的变量名*(了解即可)wx:key的使用导航路线关于微信小程序知识点一共做了六个博客,涵盖大部分内容,有想学习的可以按照以下顺序查看1.微信小程序的启动和渲染过程(加组件分类和组件的基本使用以及API分类)2.微信小程序wxml的数据和事

文字无法加粗css样式添加font-weight:bold,但是生成的图片字体未加粗。检查插件源码，发现bold被替换成了700(未设置字重的为400)解决办法：这里在源码_drawText方法的红框位置，直接将700替换回bold,插件就能正常绘制出加粗效果了。绘制结果错乱（部分内容没绘制）原因1：网络图片首先，网络图片的域名，必须在小程序设置的"downloadFile合法域名"内，否则绘制不出图片，且导致该image元素后的所有元素都没有绘制（插件不报错）其次，网络图片需要提前下载到缓存中，否则大概率绘制不出图片，且同样导致后面元素不绘制。解决办法：使用wx.downloadFile提前

一.生命周期什么是生命周期生命周期（LifeCycle）是指一个对象从创建->运行->销毁的整个阶段，强调的是一个时间段。例如：．张三出生，表示这个人生命周期的开始．张三离世，表示这个人生命周期的结束．中间张三的一生，就是张三的生命周期我们可以把每个小程序运行的过程，也概括为生命周期：．小程序的启动，表示生命周期的开始．小程序的关闭，表示生命周期的结束．中间小程序运行的过程，就是小程序的生命周期2.生命周期的分类在小程序中，生命周期分为两类，分别是：a.应用生命周期．特指小程序从启动﹣＞运行﹣＞销毁的过程b.页面生命周期．特指小程序中，每个页面的加载->渲染->销毁的过程其中，页面的生命周期范