小技巧 Shift+Alt+ ↓ 复制当前行 demo03.js js文件中的 data 其实就相当于储存变量，定义一些值，在后期可以通过名称来调用。 // pages/demo03/demo03.js Page({/*** 页面的初始数据*/data: {msg:"hello mina",num:10000,isGirl:false,person:{age:18,height:158,weight:90,name:"某女生"},ischecked:false,list:[{id:0,name:"猪八戒"},{id:1,name:"天蓬元帅"},{id:0,name:"悟能"}]} })demo03.wxml 调用在data中存储的数据的方法就...
最近上手QQ小程序，想展示文章内容，无奈自己没有服务器、数据库，QQ小程序又没有云函数，怎么办呢？只能把文章内容存放在小程序页面data中了，但是一篇文章几十行、甚至上百行，有的还有图片。于是乎找了个富文本编辑器，把文本内容输入、格式调好在转换成HTML内容。看下图。然后再转成HTML内容。但是直接复制过去吧，看下图，得一行行的缩进，比较麻烦。索性就写一段java代码把多行文本转换成一行文本，话不多少，看代码。public...
<view class="user-info">姓名：张三<text decode="{{true}}" space="{{true}}"> </text>性别：男</view>效果：
<wxs module="formatTime">var formatTimeCoupon = function(times){var date = getDate((times*1000));var year = date.getFullYear()var month = date.getMonth() + 1var day = date.getDate()month = month > 9 ? month : 0 + monthday = day > 9 ? day : 0 + dayreturn year + . + month + . + day}module.exports = {formatTimeCoupon:formatTimeCoupon} </wxs> <view>有效期至 {{formatTime.formatTimeCoupon(时间戳)}}</vie...
微信小程序 wxml中的属性记录 转载自https://www.cnblogs.com/shen5214444887/p/6554744.html 1. view 标签中的属性style 中的参数 margin-top:10px; （向上距离） display : flex; （display : flex 容器声明）flex-direction: (view中布局的方向)row; （横向布局 ，从左到右） column; （垂直布局，布局从上往下）row-reverse; （横向布局 ，从右到左） column-reverse;（垂直布局，布局从下到上） ...
1. wxml页面结构语言.wxml文件可以看做是微信小程序页面的结构化语言，也就是用于页面展示骨架的结构语言，它类似于前端开中PC端的HTML文件。在.wxml文件中，我们可以进行数据绑定 --- {{绑定的数据名}}，条件判断 --- wx:if、循环遍历 --- wx:for等等，它和vue是极其的相像，但又存在自我的独特性，比如说封装性。微信小程序为我们准备了很多高度封装的标签，使我们在日常开发的过程中直接使用标签即可完成相关对应的功能模块。对...
现在都是讲究开发的效率，原来单纯的android 和 ios 已经不在吃香了，都是混合开发，混合开发很多页面的结构基本都是上中下，head，body，foot，所以小程序也要这么的满足如图例。源码：https://github.com/limingios/wxProgram.git 中的No.8小程序的引入外部的页面include 可以将目标文件除了 template ，wxs 外的整个代码引入，相当于是拷贝到 include 位置。关键字 include官方的阐述>https://developers.weixin.qq.com/minipro...
1.出现溢出表现从图中可以看到数字超出了很长长度。代码里面是如下这样的。为什么在0.35出现？或者一些相成的计算出现? 而 0.34却不会。 0.41 也会出现，好像是二进制运算出现结果。data: {price:0.01,num:35},wxml文件仅仅是处理一个相处的结果。<view>{{price*num}} </view> 2.在wxml文件加入一个约束2位小数操作 在wxml文件里面创建一个方法，调用的时候就可以直接使用保留2位小数的问题了。创建一个wxs模块，看如下的代码，在...
在《微信小程序开发实战 之 「配置项」与「逻辑层」》中我们详细阐述了小程序开发的程序和页面各配置项与逻辑层的基础知识。下面我们继续解析小程序开发框架中的「视图层」部分。学习完这两篇文章的基础知识，动手开发一个简单的小程序应用已经不成问题了。 视图层 框架中视图层以给定的样式展现数据并反馈事件给逻辑层。 视图层由WXML（WeiXin Markup language）与WXSS（WeiXin Style Sheet）编写，由组件来进行展示，组件是视图层...
对于css不熟悉的程序员来说，开发微信小程序面临的一个比较困难的问题就是界面的排版了。微信小程序的排版就跟wxml和wxss有关了，它们两者相当于布局文件，其中wxml指定了界面的框架结构，而wxss指定了界面的框架及元素的显示样式。 一、wxml 界面结构wxmL比较容易理解，主要是由八大类基础组件构成： 一、视图容器(View Container)： 二、基础内容(Basic Content) 组件名 说明 组件名 说明 view 视图容器 icon 图标 scroll-view ...
在js中，我们需要将手机号带星号显示是很容易的事情，只需要调用字符串截断与拼接就可以了；但是，在wxml中，我们如何处理呢？微信小程序开发框架中有一个wxs，就是为了解决类似问题的，只需要在wmxl中引入wxs，就可以调用该类的方法，这一点和网页开发html中通过script引入js类似。首先，在pages同一级有个wxs目录（没有的可以自己创建），所有的wxs都可以放在这里。 subutil.wxs 在subutil.wxs中新建一个sub方法，用于根据特定需...
数据绑定<view>{{message}}</view>Page({data:{message:"数据绑定" }})列表渲染 条件渲染<view wx:for="{{list}}">值{{item}}索引{{index}}</view><view wx:if="{{flag}}">flag is {{flag}}</view>Page({data:{list:[1,2,3,4,5],flag:true}})模板引用 可以猜到原生小程序没有组件 <template name="staffName"><view>{{firstName}}</view><view>{{lastName}}</view> </template><template is="staffName" data="{{...staffA}}"></te...
微信小程序视图层WXML_事件引用引用WXML 提供两种文件引用方式import和include。importimport可以在该文件中使用目标文件定义的template，如：在 item.wxml 中定义了一个叫item的template：<!-- item.wxml --><template name="item"> <text>{{text}}</text></template>在 index.wxml 中引用了 item.wxml，就可以使用item模板：<import src="item.wxml" /><template is="item" data="{{text: forbar}}" />import 的作用域import 有...
import<!--header.wxml --> <template name="item"><text>{{text}}</text> </template><import src="../commonWxml/header.wxml"/> <template is="item" data="{{text:forBar}}"/>include<include src="../logs/logs.wxml"/>