热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

微信小程序开发经验总结

这篇文章分享微信小程序开发经验总结
学习时间不短了.今天公司不加班总结一下我的开发经验吧,以下都是我认为很重要的总结哦!写下来让我自己也记得更清楚,同时希望可以帮助到有需要的同学哦


一: 参数传值的方法

1: data-id

我们可以给HTML元素添加data-*属性来传递我们需要的值,使用方法说明:
(1)设置data-id

(2): 取值 + 传值

playTap:function(e) {

const dataset = e.currentTarget.dataset;

wx.navigateTo({

url: '../play/index?id='+ dataset.id

})

console.log(dataset.id);

}

(3):取值

onLoad:function (param) {

//页面初始化

this.setData({

currentId:param.id

})

}

?


data-*注意事项:data-*名称不能有大写字母,曾经我就因为大写了一个字母,找了半天的才发现这个错误..data-*属性中不可以存放对象


2: 设置id 的方法标识来传值

使用方法说明:

(1)设置id

(2)取值
通过e.currentTarget.id获取设置的id的值,然后通过设置全局对象的方式来传递数值


3: 在navigator中添加参数传值
使用方法说明
(1)传值:在navigator的属性url后拼接?id(参数名字)=要传递的值 (如果多个参数用&分开 &name=value&.......)

(2)取值:

onLoad (params){

app.fetch(API.detail + params.id,(err,data) => {

})

}

二:数据请求封装

1.将所有的接口放在统一的js文件中并导出

const api = {

interface1: 'https://........',

interface2: 'https://.......',

interface3: 'https://....',

.....

}

module.exports = api;

2:在app.js中创建封装请求数据的方法

fetch(url,data, callback) {

wx.request({

url,

data: data,

header: {

'Content-Type': 'application/json'

},

success(res) {

callback(null, res.data);

},

fail(e) {

callback(e);

}

})

},

3: 在子页面中调用封装的方法请求数据

import API from "../../api/api.js";

const app = getApp();

const cOnf= {

data:{

title:'正在拼命加载中...',

loadding:true

},

onLoad (){

app.fetch(API.hot,{},(err,data) => {

})

},

三:使用模板(发现模板真是个好东西哦!)

1:定义模板:name设置模板的名字

定义模板

2:使用模板
首先引入模板

然后使用模板is后写模板的name..通过data来传递需要是数据

四:Array比较好用的属性和方法

Array.isArray() 方法用来判断某个值是否为Array。如果是,则返回 true,否则返回 false。


concat() 方法将传入的数组或非数组值与原数组合并,组成一个新的数组并返回.


forEach() 方法对数组的每个元素执行一次提供的函数(回调函数)。


join() 方法将数组中的所有元素连接成一个字符串。


keys() 方法返回一个数组索引的迭代器。


map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组


pop() 方法删除一个数组中的最后的一个元素,并且返回这个元素。


push() 方法添加一个或多个元素到数组的末尾,并返回数组新的长度(length 属性值)。


toString() 返回一个字符串,表示指定的数组及其元素。

五:对象Object常用方法

1 初始化方法

var obj = [];
var obj = new obj();
var obj = Object.create(null);

2 添加元素的方法

dic[“key”] = “value”;

3 删除key的方法

delete dic[“key”];

4 清空词所有条目

dic.clear();


5 删除

delete dic;


6 查看所有属性的方法

Object.keys(obj);

对象的所有键名都是字符串,所以加不加引号都可以,如果键名是数值,会被自动转为字符串但是,如果键名不符合标识名的条件(比如第一个字符为数字,或者含有空格或运算符),也不是数字,则必须加上引号,否则会报错


6 读取属性

obj.name || obj[’name']

注意: 数值键名不能使用点运算符(因为会被当成小数点),只能使用方括号运算符。


7 检查变量是否声明

if(obj.name) || if(obj[’name'])

8 in 运算符用于检查对象是否包含某个属性,如果包含返回true,否则返回false

if ( ‘x’ in obj) {return 1}


9 for … in 循环
用来遍历一个对象的全部属性

for (var i in obj) {
console.log(obj);
}


10 with 语句
作用: 操作同一个对象的多个属性时,提供一些书写的方便

with(obj) {
name1 = 1;
name2 = 2;
}

等同于

obj.name1 = 1;
obj.name2 = 2;

以上就是微信小程序开发经验总结的详细内容,更多请关注 第一PHP社区 其它相关文章!


推荐阅读
  • wxParse 0.3:微信小程序中的高级 HTML 和 Markdown 富文本解析器,全面支持多级嵌套与 Emoji 表情
    wxParse 0.3 是一款专为微信小程序设计的高级富文本解析器,支持 HTML 和 Markdown 转换为 WXML 可视化格式。该组件不仅能够处理复杂的多级嵌套结构,还全面支持 Emoji 表情,极大地提升了内容展示的多样性和用户体验。 ... [详细]
  • 本文详细解析了JSONP(JSON with Padding)的跨域机制及其工作原理。JSONP是一种通过动态创建``标签来实现跨域请求的技术,其核心在于利用了浏览器对``标签的宽松同源策略。文章不仅介绍了JSONP的产生背景,还深入探讨了其具体实现过程,包括如何构造请求、服务器端如何响应以及客户端如何处理返回的数据。此外,还分析了JSONP的优势和局限性,帮助读者全面理解这一技术在现代Web开发中的应用。 ... [详细]
  • 通过优化模板消息机制,本研究提出了一种高效的信息化推送方案。该方案利用获取的访问令牌(access token)和指定的模板ID,实现了精准且快速的信息推送,显著提升了用户体验和信息传递效率。具体实现中,通过调用相关API接口,确保了消息的准确性和及时性,为用户提供更加便捷的服务。 ... [详细]
  • 本文介绍了如何通过掌握 IScroll 技巧来实现流畅的上拉加载和下拉刷新功能。首先,需要按正确的顺序引入相关文件:1. Zepto;2. iScroll.js;3. scroll-probe.js。此外,还提供了完整的代码示例,可在 GitHub 仓库中查看。通过这些步骤,开发者可以轻松实现高效、流畅的滚动效果,提升用户体验。 ... [详细]
  • Ceph API微服务实现RBD块设备的高效创建与安全删除
    本文旨在实现Ceph块存储中RBD块设备的高效创建与安全删除功能。开发环境为CentOS 7,使用 IntelliJ IDEA 进行开发。首先介绍了 librbd 的基本概念及其在 Ceph 中的作用,随后详细描述了项目 Gradle 配置的优化过程,确保了开发环境的稳定性和兼容性。通过这一系列步骤,我们成功实现了 RBD 块设备的快速创建与安全删除,提升了系统的整体性能和可靠性。 ... [详细]
  • 当前,众多初创企业对全栈工程师的需求日益增长,但市场中却存在大量所谓的“伪全栈工程师”,尤其是那些仅掌握了Node.js技能的前端开发人员。本文旨在深入探讨全栈工程师在现代技术生态中的真实角色与价值,澄清对这一角色的误解,并强调真正的全栈工程师应具备全面的技术栈和综合解决问题的能力。 ... [详细]
  • 可转债数据智能抓取与分析平台优化
    本项目旨在优化可转债数据的智能抓取与分析平台。通过爬取集思录上的可转债信息(排除已发布赎回的债券),并结合安道全教授提出的三条安全线投资策略,新增了建仓线、加仓线和重仓线,以提供更精准的投资建议。 ... [详细]
  • 如何利用Apache与Nginx高效实现动静态内容分离
    如何利用Apache与Nginx高效实现动静态内容分离 ... [详细]
  • PyQt5 QTextEdit:深入解析Python中多功能GUI库的应用与实现
    本文详细探讨了 PyQt5 中 QTextEdit 组件在 Python 多功能 GUI 库中的应用与实现。PyQt5 是 Qt 框架的 Python 绑定,提供了超过 620 个类和 6000 个函数及方法,广泛应用于跨平台应用程序开发。QTextEdit 作为其中的重要组件,支持丰富的文本编辑功能,如富文本格式、文本高亮和自定义样式等。PyQt5 的流行性不仅在于其强大的功能,还在于其易用性和灵活性,使其成为开发复杂用户界面的理想选择。 ... [详细]
  • 本文深入探讨了 iOS 开发中 `int`、`NSInteger`、`NSUInteger` 和 `NSNumber` 的应用与区别。首先,我们将详细介绍 `NSNumber` 类型,该类用于封装基本数据类型,如整数、浮点数等,使其能够在 Objective-C 的集合类中使用。通过分析这些类型的特性和应用场景,帮助开发者更好地理解和选择合适的数据类型,提高代码的健壮性和可维护性。苹果官方文档提供了更多详细信息,可供进一步参考。 ... [详细]
  • 基于Node.js的高性能实时消息推送系统通过集成Socket.IO和Express框架,实现了高效的高并发消息转发功能。该系统能够支持大量用户同时在线,并确保消息的实时性和可靠性,适用于需要即时通信的应用场景。 ... [详细]
  • 深入解析Tomcat:开发者的实用指南
    深入解析Tomcat:开发者的实用指南 ... [详细]
  • 在处理大规模并发请求时,传统的多线程或多进程模型往往无法有效解决性能瓶颈问题。尽管它们在处理小规模任务时能提升效率,但在高并发场景下,系统资源的过度消耗和上下文切换的开销会显著降低整体性能。相比之下,Python 的 `asyncio` 模块通过协程提供了一种轻量级且高效的并发解决方案。本文将深入解析 `asyncio` 模块的原理及其在实际应用中的优化技巧,帮助开发者更好地利用协程技术提升程序性能。 ... [详细]
  • 在Spring框架中,基于Schema的异常通知与环绕通知的实现方法具有重要的实践价值。首先,对于异常通知,需要创建一个实现ThrowsAdvice接口的通知类。尽管ThrowsAdvice接口本身不包含任何方法,但开发者需自定义方法来处理异常情况。此外,环绕通知则通过实现MethodInterceptor接口来实现,允许在方法调用前后执行特定逻辑,从而增强功能或进行必要的控制。这两种通知机制的结合使用,能够有效提升应用程序的健壮性和灵活性。 ... [详细]
  • SQLmap自动化注入工具命令详解(第28-29天 实战演练)
    SQL注入工具如SQLMap等在网络安全测试中广泛应用。SQLMap是一款开源的自动化SQL注入工具,支持12种不同的数据库,具体支持的数据库类型可在其插件目录中查看。作为当前最强大的注入工具之一,SQLMap在实际应用中具有极高的效率和准确性。 ... [详细]
author-avatar
mobiledu2502871243
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有