基于后端云微信小程序开发

在开发小程序时，bmob后端云用于提供数据存储服务。详细而简洁的文档主要是缩短开发周期。但是，对于复杂项目，建议使用自己的服务器来提供数据服务。

源代码：github.com/alex1504/wx .

以下几点分享了小程序开发过程的关键点和感受，指出：

小程序标记统称为组件，Html标记统称为元素。一些内容将使用iconfont字体图标

与vuejs和jQuery进行比较 创建一个新项目并添加一个图标

在app.wxss中以unicode引入

@ font-face {font-family:'iconfont';/*项目ID 431644 */src: url（'//at.alicdn.com/t/font_431644_aahynh26y6lp7gb9.eot'）; src: url（'//at.Alicdn.com/t/font_431644_aahynh26y6lp7gb9.eot?#iefix'）格式（'embedded-opentype'），url（'//at.alicdn.com/t/font_431644_aahynh26y6lp7gb9.woff'）格式（'woff'），url（'//at.alicdn.com/t/font_431644_aahynh26y6lp7gb9.ttf'）格式（'truetype'），url（'//at.alicdn.com/t/font_431644_aahynh26y6lp7gb9.svg#iconfont '）format（'svg'）;复制代码

定义通用图标样式并定义伪元素

.icon {display: inline-block; font-family:'iconfont';}。icon-home: {content:'\ e600';}复制代码

使用

复制代码小程序事件绑定和处理器

小程序没有类似于vuejs的v-model用于双向绑定。使用像jQuery这样的bindinput来监听输入事件以更新事件处理程序中的数据。事件对象e.data.value可以获取输入值。

//bindconfirm监听键盘回车事件，focus属性会自动弹出手机软键盘复制码bindSearchInput（e）{this.setData（{searchTxt: e.detail.value}）} copy code

小程序中的事件处理程序不传递像vue这样的参数，因为事件处理程序只有一个默认参数事件对象。如果你想在for循环的组件中获取元素绑定的id，你可以使用与jQuery相同的方式。绑定数据属性。

复制代码

获取ID：

//事件处理函数navigateToDetail:函数（e）{const id=e.currentTarget.dataset.id;}复制代码以防止事件冒泡bindtap，bindlongtap，bindtouchstart，bindtouchmove，bindtouchend，bindtouchcancle复制代码

用catch替换绑定以获取相应的冒泡事件

使用setData

小程序视图更新需要调用setData来修改绑定数据，而直接修改数据不会触发视图层更新。 setData接受一个对象作为需要添加或修改的属性。属性名称有点特殊，[]中的值被识别为变量，因此如果要修改对象数组中的属性，则只能预拼接属性名称。错误的方式：

//View不会更新this.data.searchSongs [index] .love_flag': 2 //语法错误:未知:意外的tokenthis.setData（{'searchSongs ['+ index +'] .love_flag': 2}）复制代码

正确的做法：

setSongFlag（e）{//请注意，setData属性name []中的非整数值将被识别为变量let key='searchSongs ['+ index +'] .love_flag'this.setData（{[key]: 2}）复制有关图像组件

的代码 小程序wxss背景图像和图像组件不支持本地URL在H5的开发中，通常我们会将img标签用于一些不需要根据容器大小选择显示模式的图片，并需要一些特殊的显示模式使用背景。但小程序只需要图像组件。它提供了一个模式属性和一个背景定义图像以及一个img元素来控制图像的显示方式。

模式属性background-sizehtml img元素scaleToFill100％，100％（默认）宽度: 100％; height: 100％aspectFitcontainjs implementation aspectFillcoverjs implementation widthFix100％，autowidth: 100％;

其他顶部，底部，右侧，左侧等不缩放图像以调整属性的位置和背景位置角色，img元素只能通过定位来控制。

小程序API异步方案

如果没有强迫症，小程序API可以使用默认的回调方法。此外，由于小程序仅支持es6，因此不支持async和await，并且可以将API封装到promise中。

函数promisify（fn）{return function（obj={}）{return new Promise（（resolve，reject）=> {obj.success=function（res）{resolve（res）} obj.fail=function（res）{ reject（res）} fn（obj）//执行函数，obj是传递给函数的参数}}}} module.exports={promisify: promisify} copy code

使用：

const promisify=require（'./promisify.js'）const request=promisify（wx.request）; request（{url:'some URL'method:'GET'，}）。then（res=> {console.Log （res）}复制代码小程序问题调试器没有css快捷方式提示功能和颜色面板，影响布局和颜色调整效率（性感）不能引入第三方js库内置组件单调，不考虑自适应字体数情况不支持跳转外部链接背景图像或图像组件不能使用本地图像HiShop小程序工具提供多类型商城/商店小程序制作，可视化编辑1秒在线生成5步。通过拖动和拼接模块布局小程序商城页面，你看收入，你只需要艺术家做一个漂亮的商场。欲了解更多小程序商店，请检查：小程序商店

＆lt; 汇海（www.hvihi.com）是国内知名的商城系统和商城网站建设提供商，其中汇海技术小程序系统提供小程序商城开发，小程序配送系统，微分配系统，商城系统，电子商务网站建设， 微信发行系统，小程序商城及其他多端商场和电子商务行业解决方案＆gt;

确认：这个文件和图像源网络编辑器的网站部分，如果有侵权及时通信删除。 汇海hvihi.com网站原创文章，请注明出处。