微信小程序开发最常见的代码(微信小程序开发最常见的代码是)

今天小程序小编为大家带来微信小程序开发最常见的代码,喜欢的记得收藏喔!

在通过微信小程序开发者工具开发一款小程序时,起初我们会自动生成一些文件目录,这个文件目录有4种不同的类型,主要分成4种:.wxml 后缀的 WXML 模板文件,.wxss 后缀的 WXSS 样式文件,.js 后缀的 JS 脚本逻辑文件以及. JSON 后缀的 JSON 配置文件,微信小程序的开发代码就是由这些构成。

1、WXSS 样式:

WXSS就是小程序版的CSS,它具有CSS 大部分的特性,小程序在 WXSS 也做了一些扩充和修改。

2、WXML 模板:

开发过网页的人知道,网页开发编程采用的是HTML CSS JS这样的框架组合,其中HTML是用来制作当前这个页面的整体框架结构,CSS 用来提供结构样式,JS 则是进行逻辑处理以及这个页面和用户的交互。

JS 只需要管理状态即可:

this.setData({msg: Hello World })通过 {{ }} 的语法把一个变量绑定到界面上,我们称为数据绑定。仅仅通过数据绑定还不够完整的描述状态和界面的关系,还需要 if/else, for等控制能力,在小程序里边,这些控制能力都用 wx: 开头的属性来表达。

微信小程序开发最常见的代码(微信小程序开发最常见的代码是)

微信小程序开发最常见的代码

3、JSON 配置:

我们可以看到在项目的根目录有一个 app.json 和 project.config.json,此外在 pages/logs 目录下还有一个 logs.json,我们依次来说明一下他们的用途。

小程序配置 app.json

app.json 是对当前小程序的全局配置,包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。QuickStart 项目里边的 app.json 配置内容如下:

{ pages:[ pages/index/index, pages/logs/logs

], window:{ backgroundTextStyle:light, navigationBarBackgroundColor:#fff, navigationBarTitleText: WeChat, navigationBarTextStyle:black

}

}

这个配置各个项的含义如下:

pages字段 —— 用于描述当前小程序所有页面路径,这是为了让微信客户端知道当前你的小程序页面定义在哪个目录。

window字段 —— 小程序所有页面的顶部背景颜色,文字颜色定义在这里的。

工具配置 project.config.json

通常大家在使用一个工具的时候,都会针对各自喜好做一些个性化配置,例如界面颜色、编译配置等等,当你换了另外一台电脑重新安装工具的时候,你还要重新配置。

考虑到这点,小程序开发者工具在每个项目的根目录都会生成一个 project.config.json,你在工具上做的任何配置都会写入到这个文件,当你重新安装工具或者换电脑工作时,你只要载入同一个项目的代码包,开发者工具就自动会帮你恢复到当时你开发项目时的个性化配置,其中会包括编辑器的颜色、代码上传时自动压缩等等一系列选项。

页面配置 page.json

这里的 page.json 其实用来表示 pages/logs 目录下的 logs.json 这类和小程序页面相关的配置。

如果你整个小程序的风格是蓝色调,那么你可以在 app.json 里边声明顶部颜色是蓝色即可。实际情况可能不是这样,可能你小程序里边的每个页面都有不一样的色调来区分不同功能模块,因此我们提供了 page.json,让开发者可以独立定义每个页面的一些属性,例如刚刚说的顶部颜色、是否允许下拉刷新等等。

4、JS 交互逻辑

一个服务仅仅只有界面展示是不够的,还需要和用户做交互:响应用户的点击、获取用户的位置等等。在小程序里边,我们就通过编写 JS 脚本文件来处理用户的操作。

{{ msg }}点击我

点击 button 按钮的时候,我们希望把界面上 msg 显示成 Hello World,于是我们在 button 上声明一个属性: bindtap ,在 JS 文件里边声明了 clickMe 方法来响应这次点击操作:

Page({

clickMe: function() { this.setData({ msg: Hello World})

}

})

此外你还可以在 JS 中调用小程序提供的丰富的 API,利用这些 API 可以很方便的调起微信提供的能力,例如获取本地存储、用户信息、微信支付等。

以上4种是微信小程序开发最常见的代码,希望能帮到大家,想了解更多是商城网站建设问题,可以咨询TPshop小程序商城。

关注作者,关注TPshop开源商城(tp-shop.cn),每天给你写点不给写的,看点不给看的。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

(2)
上一篇 2023年4月5日 上午9:18
下一篇 2023年4月5日 上午9:28

相关推荐

  • 家庭档案管理系统

    家庭档案管理系统: 让家更美好 随着科技的不断发展,家庭档案管理系统已经成为越来越多家庭的必备工具。通过该系统,家庭用户可以方便地管理和记录家庭中的各种文件和信息,如照片、文档、家…

    科研百科 2024年5月26日
    73
  • 悦读-做项目管理不要崇拜方法论

    许多项目经理过于推崇某种方法论,这会妨碍他们管理项目,使完成的项目不能成为实用且值得称赞的工作成果。如果你在最近的工作中使用过一种特定的方式,或者是在学校学的,或者是取得了资格认证…

    2022年6月21日
    249
  • 专利研究项目延期理由

    专利研究项目延期理由专利研究项目延期理由:春秋战国时期,该研究者做的“专利申请为秦国列国研究,以后仍以同国作为研究对象,因此用于各个国家的经营和研究”。专利申请为我国传统名著之一,…

    科研百科 2024年11月20日
    0
  • 科研经济指标

    科研经济指标是衡量科研工作成效的重要指标,对于科研工作者而言,掌握科研经济指标非常重要。本文将介绍科研经济指标的基本概念和常用的几种指标,并针对科研工作者在实际工作中应该如何运用这…

    科研百科 2024年10月8日
    25
  • 作为本科研项目依托工程的现场负责人,对本项目的贡献

    作为本科研项目依托工程的现场负责人,我对本项目的贡献感到非常自豪。我们团队在项目现场辛勤工作,严格按照合同约定的要求,全力以赴地完成了各项任务。 作为工程现场负责人,我的首要任务是…

    科研百科 2024年11月22日
    1
  • 科技部有哪些项目

    科技部有哪些项目 科技部作为国家科技管理部门,一直致力于推动科技创新和发展。近年来,随着科技的不断发展,科技部也不断开展了许多重要的项目和计划。以下是一些具体的项目介绍。 1. 9…

    科研百科 2024年10月8日
    32
  • 控制项目进度的方法之一:里程碑式管理(项目管理里程碑案例)

    在整个项目中,项目进度的控制是头等大事之一。 通过里程碑式管理是控制项目进度的方法之一。 里程碑是什么,以我们熟悉的马拉松为例,整个赛道每隔一段就会有提醒标志,这个标志就是里程碑,…

    科研百科 2022年12月26日
    271
  • 坚持党建引领 深化转型发展 不断激发四川国经高质量发展强劲动能

    来源: 原创稿 党的二十大报告提出:“推进国有企业、金融企业在完善公司治理中加强党的领导,加强混合所有制企业、非公有制企业党建工作。”为进一步加强国企党的建设指明了方向。四川国经公…

    科研百科 2024年6月28日
    47
  • 环境项目管理软件

    环境项目管理软件:对环境项目的挑战和机遇 随着全球气候变化和环境问题日益突出,越来越多的组织开始意识到环境项目的重要性。然而,传统的环境项目管理软件难以满足这些组织的需求,因此需要…

    科研百科 2024年5月29日
    74
  • 工程招投标与合同管理期末考试

    工程招投标与合同管理期末考试总结 随着现代社会的不断发展,工程招投标与合同管理已成为工程领域中不可或缺的一部分。在工程招投标过程中,业主需要选择最合适的供应商来提供所需的产品和服务…

    科研百科 2024年8月28日
    41