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

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

在通过微信小程序开发者工具开发一款小程序时,起初我们会自动生成一些文件目录,这个文件目录有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),每天给你写点不给写的,看点不给看的。

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

(0)
上一篇 2024年5月10日 上午11:18
下一篇 2024年5月10日 上午11:30

相关推荐

  • 项目管理 软件排名

    项目管理软件排名:选择最适合你的软件 在现代社会,项目管理已经成为一项非常重要的任务,因为项目的成功对于公司的运营和利润都是至关重要的。因此,市场上有许多不同的项目管理软件可供选择…

    科研百科 2024年5月26日
    53
  • 项目管理信息系统供应商

    项目管理信息系统供应商 随着信息技术的不断发展,项目管理信息系统(Project Management Information System,PMIS)也逐渐成为了项目管理中不可或…

    科研百科 2025年1月29日
    3
  • 科研项目调研表填写范本

    科研项目调研表填写范本 科研项目调研是研究项目开展前的重要一步,也是保证项目进展的重要保障。在填写科研项目调研表时,需要认真填写相关信息,以便对项目开展情况进行准确、全面的了解。以…

    科研百科 2025年3月28日
    4
  • 如何去找科研项目

    如何去找科研项目 随着科技的不断进步,科研项目也在不断发展。想要找到科研项目,可以有以下几种方法: 1. 学术搜索引擎:学术搜索引擎如Google Scholar、百度学术等,可以…

    科研百科 2025年2月10日
    7
  • 联影医疗科研项目介绍怎么写

    联影医疗科研项目介绍 随着现代医学的不断发展,医疗科技也在不断进步。在这个时代,联影医疗成为了一个备受关注的品牌。联影医疗的科研项目涵盖了多个领域,包括医学影像、人工智能、机器人等…

    科研百科 2024年8月13日
    6
  • 面上项目中标率(科研项目中标率怎么算出来的)

    科研项目中标率的计算方法 在项目管理中,中标率是衡量项目成功的一个重要指标。中标率是指项目中获胜的项目的比率。中标率越高,说明项目的成功程度越高。但是,如何计算科研项目中标率是一个…

    科研百科 2024年8月5日
    11
  • 项目管理到底做什么

    项目管理到底做什么 项目管理是一种组织和管理项目的方法,旨在确保项目在规定的时间和预算内完成,并达成项目目标和成果。在现代商业环境中,项目管理已经成为了一项非常重要的技能,对于企业…

    科研百科 2024年7月25日
    1
  • 达内项目管理系统代码

    达内项目管理系统代码 随着现代软件开发的不断推进,越来越多的公司开始使用项目管理系统来提高工作效率和质量。而达内作为一家专业的软件开发公司,也推出了自己的项目管理系统,帮助程序员们…

    科研百科 2025年1月1日
    2
  • 科研项目简介要怎么写

    科研项目简介怎么写 科研项目简介是一份非常重要的文档,用于向他人介绍你的科研项目。一份好的科研项目简介应该包括以下内容: 1. 项目背景– 简要介绍项目的背景,包括研究…

    科研百科 2025年3月26日
    10
  • 科研项目管理人员年终总结科研项目管理人员年终总结

    科研项目管理人员年终总结 2022年已经接近尾声,回首这一年,我们作为科研项目管理人员,经历了许多挑战和收获。在这一年中,我们团队成功地完成了多个科研项目,并在项目管理和学术研究方…

    科研百科 2024年6月12日
    47