当前位置: 首页 > news >正文

【整理】微信小程序开发须知

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

      首先,就是首次开发微信小程序时,容易忽略的一些问题,这可能我们后期的开发上线工作,造成不便。现做如下总结:

1、注意:微信小程序服务类目审核问题

微信小程序

红色标注部分,都需要企业资质认证的。这也就造成了一些开发的门槛。

解决方案:请参考我的另一篇博客【解决】小程序要求的 TLS 版本必须大于等于 1.2

2、微信小程序接口调用须知

利用wx.request方法,调用远程接口,必须使用HTTPS安全加密,这就需要,在服务端,进行证书的安装。

如果有阿里云产品的话,可以使用阿里云免费证书服务,购买后,按照上面的安装步骤,进行安装即可。

其次,服务器必须支持TLS1.2版本以上,

微信小程序

这里提供Windows平台的参照信息。

3、控制台常见的警告信息处理

微信小程序

意思很明显,就是说,你在绑定数据数据时候,尤其在用wx:for循环时,你可以给元素添加wx:key="属性名",通过这种方式,来提高小程序的性能。所以,从此刻起,我们在做微信小程序的时候,就习惯性的给其添加一个wx:key属性。例如:

<!--Begin Grid 九宫格-->
<template name="tpl-grid">
        <block wx:for-items="{{grids}}" wx:key="{{index}}">
                <navigator url="{{item.url}}" class="weui-grid" hover-class="weui-grid_active">
                    <image class="weui-grid__icon" src="{{item.icon}}" />
                    <view class="weui-grid__label">{{item.name}}</view>
                </navigator>
        </block>
</template>
<!--End Grid 九宫格-->

原则上,wx:key指定的属性名,最好可以唯一,建议最简单的做法是wx:key="index",遇到wx:for这样的标记,就再加一个wx:key="index"即可,这样类似这样的警告信息,就会消失。

4、视图数据的修改,请使用setData方法。

这个问题比较简答,初次接触微信小程序开发的朋友,因为看起语法,类似javascript,直接对Page对象的data属性,进行赋值操作,虽然不会造成错误,但是修改后的数据,不能及时更新视图。常见的写法,也是推荐的写法:

var this=that;that.setData({});这种形式

5、tagBar的配置显示问题。

tagBar须配置在app.json中。

如果我们的小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),那么我们可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面。

Tip: 通过页面跳转(wx.navigateTo)或者页面重定向(wx.redirectTo)所到达的页面,即使它是定义在 tabBar 配置中的页面,也不会显示底部的 tab 栏。

注意:tabBar 是一个数组,只能配置最少2个、最多5个 tab,tab 按数组的顺序排序。

首次使用tagBar配置时,如果tagBar不显示,那么我们首要考虑,当前页面,是否在tagBar的pagePath配置中出现。

6、微信小程序,模板数据绑定延伸。

 6.1、wx:for的应用。wx:for不仅可以指定数组对象,同样可以指定一个对象,了解javascript的朋友,都知道,javascript中for同样可以用于对象的循环。例如:

Page({
  data:{ user:null},
  onLoad:function(options){
    // 页面初始化 options为页面跳转所带来的参数
    var app=getApp(),that=this;
    that.setData({user:{name:"李朝强",mobile:"1589XXXX403"}});
  }
})

我们给Page对象的data属性,赋了一个user对象。

<template name="tpl-item">
    <view class="page__bd">
        <view class="weui-article">
            <view class="weui-article__section">
                <view class="weui-article__section">
                    <view class="weui-article__p" wx:for="{{user}}" wx:key="index">
                     <text class="label">{{index}}</text>:{{user[index]}}
                    </view>
                </view>
            </view>
            </view>
    </view>
</template>

模板代码中的index,在对象中指定是对象的属性名,name,mobile这类信息。

 

 

 

转载于:https://my.oschina.net/lichaoqiang/blog/842664

相关文章:

  • Unity Remote 5 使用
  • puppet自动化技术基础分析及实例部署详解
  • DSOframer的简单介绍和资源整理
  • swift开发多线程篇 - 多线程基础
  • 杭电2003——求绝对值
  • 《ArcGIS Runtime SDK for Android开发笔记》——(5)、基于Android Studio构建ArcGIS Android开发环境(离线部署)...
  • linux 性能篇 -- ps的用法
  • Linux命令篇之du命令和read命令
  • Skynet 小试Debug_console...
  • 大数据~说说Hadoop
  • oracle获取clob调优
  • maven的setting.xml配置,解决maven下载速度过慢
  • java中的String类常量池详解
  • 从0移植uboot (二) _uboot启动流程分析
  • NHibernate 基础教程
  • __proto__ 和 prototype的关系
  • Apache Spark Streaming 使用实例
  • Java,console输出实时的转向GUI textbox
  • Koa2 之文件上传下载
  • MyEclipse 8.0 GA 搭建 Struts2 + Spring2 + Hibernate3 (测试)
  • React中的“虫洞”——Context
  • Spring思维导图,让Spring不再难懂(mvc篇)
  • 构造函数(constructor)与原型链(prototype)关系
  • 浅谈Kotlin实战篇之自定义View图片圆角简单应用(一)
  • 软件开发学习的5大技巧,你知道吗?
  • 深度解析利用ES6进行Promise封装总结
  • 手机app有了短信验证码还有没必要有图片验证码?
  • elasticsearch-head插件安装
  • 关于Kubernetes Dashboard漏洞CVE-2018-18264的修复公告
  • 数据库巡检项
  • #laravel 通过手动安装依赖PHPExcel#
  • $HTTP_POST_VARS['']和$_POST['']的区别
  • (1)虚拟机的安装与使用,linux系统安装
  • (多级缓存)缓存同步
  • (附源码)ssm码农论坛 毕业设计 231126
  • (过滤器)Filter和(监听器)listener
  • (黑客游戏)HackTheGame1.21 过关攻略
  • (免费领源码)python#django#mysql公交线路查询系统85021- 计算机毕业设计项目选题推荐
  • (算法)N皇后问题
  • (循环依赖问题)学习spring的第九天
  • (原)Matlab的svmtrain和svmclassify
  • (转)Android学习系列(31)--App自动化之使用Ant编译项目多渠道打包
  • (转)Sql Server 保留几位小数的两种做法
  • (转)可以带来幸福的一本书
  • .net 8 发布了,试下微软最近强推的MAUI
  • .NET Micro Framework初体验(二)
  • .net操作Excel出错解决
  • .NET框架设计—常被忽视的C#设计技巧
  • @Autowired标签与 @Resource标签 的区别
  • @Controller和@RestController的区别?
  • [ 英语 ] 马斯克抱水槽“入主”推特总部中那句 Let that sink in 到底是什么梗?
  • [【JSON2WEB】 13 基于REST2SQL 和 Amis 的 SQL 查询分析器
  • [20190113]四校联考
  • [ASP]青辰网络考试管理系统NES X3.5
  • [BZOJ4016][FJOI2014]最短路径树问题