小程序

微信小程序引入模板的方法： 第一种：通过import引入 <!-- currency.wxml --> <!-- 首先创建一个currency项目，里面放的是你要引入的内容 --> <template>     <view><!-- data为自定义 接收父页面传入的数据 -->         <text>￥{{item.price}}</text>     </view></template><template>   <text>在index页面，is那个name，才会引入哪个<text></text><template></template></text></template> 登录后复制 <!-- index.wxml --> <import></import><!-- 在所要应用的页面导入路径 --><template><template></template><!-- 将js里名为shoping的数据 赋给data --></template> 登录后复制 第二种：通过include导入…

微信小程序如何获取元素的高度     1、获取元素的高度（px单位）： let query = wx.createSelectorQuery(); query.select('.content').boundingClientRect(rect=&gt;{   let height = rect.height;   console.log(height); }).exec(); 登录后复制 2、获取元素的高度（rpx单位），使用宽高比换算获得：（以下的750是该元素的宽度，单位是rpx的） let query = wx.createSelectorQuery(); query.select('.content').boundingClientRect(rect=&gt;{   let clientHeight = rect.height;   let clientWidth = rect.width;   let ratio = 750 / clientWidth;   let height = clientHeight * ratio;   console.log(height); }).exec(); 登录后复制 3、在页面渲染完成OnReady回调，获取元素高度时，如果不加定时器，获取的元素的高度还是没渲染完异步数据前的高度。故需要加定时器 onReady () {     setTimeout(() =&gt; {     let query = wx.createSelectorQuery();     query.select('.content').boundingClientRect(rect=&gt;{         let height = rect.height;         console.log(height);         }).exec();…

本篇文章给大家带来的内容是介绍小程序如何实现星级评分效果？（代码示例）。有一定的参考价值，有需要的朋友可以参考一下，希望对你们有所帮助。 效果图 wxml <view > <block wx:for="{{stars}}"> <image class="star-image" style="left: {{item*100}}rpx" src="{{key > item ?(key-item == 0.5?halfSrc:selectedSrc) : normalSrc}}"> <view class="item" style="left:0rpx" data-key="{{item+0.5}}" bindtap="selectLeft"></view> <view class="item" style="left:50rpx" data-key="{{item+1}}"…

什么是WeUI?WeUI是在遵守微信视觉设计规范下，由官方设计团队为小程序量身定制的基础样式库。这里把WeUI放到基础篇里，是因为WeUI是官方出品，并且在10月28号IDE更新后，IDE不能识别和引用css，同时也屏蔽了从网络获取样式文件，和css划清界限。》》》 如何引入WeUI下载WeUIweui.wxss注意是在【weui-wxss/dist/style/】目录下，不要【weui-wxss/src】目录里面下载将weui.wxss拷贝到小程序根目录中在app.wxss或页面wxss导入weui.wxss/**app.wxss**/ @import ‘weui.wxss’;以上就成功引入了weui.wxss，weui也提供了单个组件的样式引入，流程同上。》》》 如何使用WeUI根组件使用class=”page” 1. 简介：什么是WeUI?  WeUI是在遵守微信视觉设计规范下，由官方设计团队为小程序量身定制的基础样式库。  这里把WeUI放到基础篇里，是因为WeUI是官方出品，并且在10月28号IDE更新后，IDE不能识别和引用css，同时也屏蔽了从网络获取样式文件，和css划清界限。 2. 简介：TODO：小程序集成WeUI WeUI 为微信 Web 服务量身设计。WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信 Web 开发量身设计，可以令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。 1.使用微信开发者工具添加新项目MWL 2.下载WeUI… 3. 简介：微信公众号开发weui使用心得，避免少犯错！ 4. 简介：WeUI是微信Web服务开发的UI套件, 目前包含12个模块 (Button, Cell,…

类图/**  * 自定义集合接口, 类似java.util.Collection  * 用于数据存储  * @author stone  *  */ public interface ICollection  { IIterator  iterator(); //返回迭代器 void add(T t); T get(int index); }/**  * 自定义迭代器接口 类似于java.util.Iterator  * 用于遍历集合类ICollection的数据  *&nb 1. 简介：类图/** * 自定义集合接口, 类似java.util.Collection * 用于数据存储 * @author stone * */public…

怎么在小程序中实现一个可截断的瀑布流组件？下面本篇文章给大家介绍一下微信小程序实现可截断瀑布流组件的方法，希望对大家有所帮助！ 瀑布流是一种常见的布局方式，实现的方式有许多，比如直接分两列，然后控制在左右两列加入元素；还有一种方式就是通过绝对定位的方式来放置两边。【相关学习推荐：】 本文所要介绍的瀑布流不同于常规的，因为瀑布流中间可能会被截断： 对于上面的布局，如果强制分成两列去做布局就不太适合了，因此我采用了绝对定位的方式来进行布局，由于瀑布流中的元素高度都不是固定的，因此我得想办法获取到每个元素的高度，然后判定元素到底是放一整行，还是左侧，亦或者右侧。 首先我们来看下模板部分的实现： <view><view><abstract></abstract></view></view><view><view><abstract></abstract></view></view> 登录后复制 模板比较简单，一个 container 容器，然后循环数组，平级渲染出一堆 wrapper 容器。 wrapper 容器是一个绝对定位的包裹元素，wrapper 容器里面需要放置需要实际渲染的组件，为了灵活性更高一点，我把这个渲染组件设置成了虚拟节点，在使用组件的时候可以指定实际渲染的自定义组件。 因为 wrapper 元素是绝对定位的，因此我们需要手动去维护整个 container 容器的高度。 这里有个问题是，我们怎么获取里面元素的高度呢？模板中的 computed-zone 就是来解决这个问题的，在将元素放置到数组之前，我们先把元素在 computed-zone 中进行渲染，然后通过 WXML api 来获取其中元素的实际渲染尺寸，这样我们就可以知道这个元素实际渲染的宽高度了。…

严格来说，这不能算是一篇微信小程序教程，不过会使用到上一篇中的app.js代码作为示例，姑且充个数吧。 回调函数 回调函数，对于初入编程这一行的同学可能会有些难以理解，毕竟回调函数的使用和程序顺序执行的直观流程是相悖的。 想象你定了一个外卖，一种是你定时去查看外卖有没有到，一种是你出示电话号码给外卖员，到达的时候电话通知你。 很容易可以看出第二种是更加高效的方案，其实这种通知机制应用到编程领域，就是回调函数了。 熟悉win32开发的同学应该知道，典型的windows程序框架就是一个消息循环外加一个窗口过程函数。其中windows系统接管消息接受，之后调用开发者的窗口过程函数来完成具体的消息处理逻辑。窗口过程函数就是一个回调函数。 为什么需要回调函数 以上面的 win32程序为例。我们知道出于安全性考虑，windows操作系统是不允许开发者直接访问硬件资源的。微软的开发者提供了api来处理消息循环，但是具体消息的响应逻辑需要开发者来提供，这种情形下，回调函数就是很好的实现方案。 再举一个例子，想象你参与一个手机设备管理软件项目的开发工作，你负责底层设备通信模块。当用户插入设备到电脑中时，你需要通知上层的模块进行处理。出于灵活性和通用性的考虑，你不可能将设备连接时的处理逻辑放在你负责的模块中，此时可以由上层调用者提供一个回调函数，在设备连接时你的模块调用回调函数即可。 关于回调函数，有一个所谓的好莱坞准则：Don’t call me; I’ll call you！ 匿名函数 在c，c++等语言中，当需要使用回调函数时，需要预先定义一个函数体。而回调函数通常只是提供给其它模块进行调用，为了简化编码，后续的javascript等脚本语言中提供了对匿名函数的支持。(注: 新的c++标准也开始支持匿名函数，称为Lambda函数) getUserInfo:function(cb){     var that = this     if(this.globalData.userInfo){       typeof cb == "function" &amp;&amp; cb(this.globalData.userInfo)     }else{       //调用登录接口       wx.login({         success: function () {           wx.getUserInfo({…

一、简介 在前面的几篇微信功能开发文档中，各个微信的功能都是独立的，单一微信只能提供一种功能，这样不符合大众开发者和客户的需求。所以在这一篇文章中，我们将对前面开发出来的微信功能进行简单整合，以供读者参考。 二、思路分析 一种简单的做法是，截取关键字，然后进行判断，执行相应功能代码。这种做法比较适合功能不多，简单的微信；另一种做法是，给各功能编号，然后记录用户选择的功能状态，用户每次查询的时候，首先判断他的状态，然后执行相应功能代码。这种做法适合功能整合比较多，复杂的微信；开发者可以根据自己的需要来进行选择。在这篇文章中，我们将会讲解天气和翻译功能的整合，更多功能的整合类似，大家可以参考着做一下。 三、关键字截取做法 3.1 关键字截取 我们定义用户发送过来的消息格式是固定好的，查询天气格式为 “地区+天气”，例如 “苏州天气”、“北京天气”，所以首先截取后两个字，判断是否为 “天气” 关键字，然后再截取前面的城市名，进行查询。同理，翻译也是截取前面的两个字，判断是否为“翻译”关键字，然后再截取后面的文字进行查询操作。 //截取关键字 $weather_key = mb_substr($keyword,-2,2,"UTF-8"); $city_key = mb_substr($keyword,0,-2,"UTF-8"); $translate_key = mb_substr($keyword,0,2,"UTF-8"); $word_key = mb_substr($keyword,2,200,"UTF-8"); 登录后复制 3.2 功能整合 if($weather_key == '天气' &amp;&amp; !empty($city_key) &amp;&amp; $translate_key != '翻译'){     $contentStr = _weather($city_key); }elseif($translate_key == '翻译' &amp;&amp; !empty($word_key)){     $contentStr = _baiduDic($word_key); }else{     $contentStr = "感谢您关注【卓锦苏州】 微信号：zhuojinsz"; }…

这篇文章主要介绍了微信小程序redux绑定实例详解的相关资料,需要的朋友可以参考下 微信小程序Redux绑定实例详解 安装 clone或者下载代码库到本地: git clone https://github.com/charleyw/wechat-weapp-redux 登录后复制 将dist/wechat-weapp-redux.js(或者拷贝minify的也可以)文件直接拷贝到小程序的工程中,例如（下面假设我们把第三方包都安装在libs目录下）: cd wechat-weapp-redux  cp -r dist/wechat-weapp-redux.js /libs 登录后复制 上面的命令将包拷贝到小程序的libs目录下 使用 1.将Redux Store绑定到App上。 const store = createStore(reducer) // redux store    const WeAppRedux = require('./libs/wechat-weapp-redux/index.js');  const {Provider} = WeAppRedux; 登录后复制 Provider是用来把Redux的store绑定到App上。 App(Provider(store)({  onLaunch: function () {   console.log("onLaunch")  } })) 登录后复制 provider的实现只是简单的将store加到App这个global对象上,方便在页面中用getApp取出来 上面这段代码等同于:…

background-color: rgb(255, 255, 255);”>配置 我们使用app.json文件来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。 以下是一个包含了所有配置选项的简单配置app.json ： {  "pages": [    "pages/index/index",    "pages/logs/index"   ],  "window": {    "navigationBarTitleText": "Demo"   },  "tabBar": {    "list": [{      "pagePath": "pages/index/index",      "text": "首页"     }, {      "pagePath": "pages/logs/logs",      "text": "日志"     }]   },  "networkTimeout": {    "request": 10000,    "downloadFile": 10000   },  "debug": true} 登录后复制 app.json 配置项列表 pages 接受一个，每一项都是，来指定小程序由哪些页面组成。每一项代表对应页面的【路径+文件名】信息，数组的第一项代表小程序的初始页面。小程序中/减少页面，都需要对 pages 数组进行修改。 文件名不需要写文件后缀，因为会自动去寻找路径.json,.js,.wxml,.的四个文件进行整合。 如开发目录为： pages/ pages/index/index.wxml pages/index/index.js pages/index/index.wxss…