微信里面app，16年推出
竞品：支付宝小程序，钉钉，美团，头条，抖音小程序
优点
1，在微信里面自由分享，2，不用下载app，3,能快速的开发，使用微信的api接口
如果你还没有微信公众平台的账号，请先进入微信公众平台首页，点击 “立即注册” 按钮进行注册。注册的账号类型可以是订阅号、服务号、小程序以及企业微信，我们选择 “小程序” 即可。
接着填写账号信息，需要注意的是，填写的邮箱必须是未被微信公众平台注册、未被个人微信号绑定的邮箱，而且每个邮箱仅能申请一个小程序。
激活邮箱之后，选择主体类型为 “个人类型”，并按要求登记主体信息。主体信息提交后不可修改，该主体将成为你使用微信公众平台各项服务和功能的唯一法律主体与缔约主体，在后续开通其他业务功能时不得变更或修改。
下载微信web开发者工具，根据自己的操作系统下载对应的安装包进行安装即可。
- 在pages文件夹右键建立新的文件夹
- 在文件中右键新建页面
- 哪个page在最上面，默认显示哪页
- json要求严格语法，不能有多余的注释和逗号
这样新的页面就建好了我们来看看都有什么
ceshi.wxml 模板文件
ceshi.js 业务逻辑
ceshi.wxss 样式
ceshi.json 页面配置
把新建的文件路径调到最上面那就是主页了，意思就是，第一个路径就是首页的路径!
页面配置：
小程序的模板语法约等于vue的模板语法
（不常用）
import
只能导入template内容
template/utils.wxml
< template name=“userCart”> 用户名：{{name}} < /temlate>
home.wxml
< import src=“/template/utils.wxml”>
< tempate is=“userCart” data=“{{…u1}}”>
include
只能导入非template内容
template/foot.wxml < view> {{内容}} </ view>
home.wxml < include src=“/template/foot.wxml”>
显示提示
- showToast
本地存储
- wx.setStorageSync(key,value)
本地取
- wx.getStorageSync(key)
- wx.request 网络请求
这是最常见的一种跳转方式,相当于html里的a标签.但需要注意的是 该方法不能跳转tabbar页面.
格式为:
通过构造js函数,在函数中调用该接口可实现页面跳转的效果.但该接口同样不能跳转tabbar页面.跳转后左上角有返回小箭头,点击可返回原本页面.
格式为:
格式为:
跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面；该方法只能跳转tabbar页面.
wxml
js
关闭所有页面，打开到应用内的某个页面。 跟 wx.redirectTo 一样左上角不会出现返回箭头，但两者却不完全相同；
格式为:
tabBar 是移动端应用常见的页面效果， 用于实现多页面 的快速切换 。
小程序中通常将其分为：
1，底部 tabBar
2，顶部 tabBar
- tabBar中只能配置最少 2 个、最多 5 个 tab 页签
- 当渲染顶部 tabBar 时，不显示 icon，只显示文本
配置 tabBar 选项
① 打开 app.json 配置文件，和 pages、window 平级，新增 tabBar 节点
② tabBar 节点中，新增 list 数组 ，这个数组中存放的，是每个 tab 项的配置对象
③ 在 list 数组中， 新增每一个 tab 项的配置对象 。对象中包含的属性如下： pagePath 指定当前 tab 对应的页面路径 【 必填 】
text 指定当前 tab 上按钮的文字【 必填】
iconPath 指定当前 tab 未选中时候的图片路径【可选】
selectedIconPath 指定当前 tab 被选中后高亮的图片路径【可选】
代码如下：
wxml 代码如下：
js 代码如下：
页面传递的参数
介绍
步骤一 通过 npm 安装
使用 npm 构建前，请先阅读微信官方的 npm 支持
步骤二 修改 app.json
注意：
由于目前新版开发者工具创建的小程序目录文件结构问题，npm构建的文件目录为miniprogram_npm，并且开发工具会默认在当前目录下创建miniprogram_npm的文件名，所以新版本的miniprogramNpmDistDir配置为 ‘https://blog.csdn.net/m0_/article/details/’ 即可
步骤四 构建 npm 包
打开微信开发者工具，点击 工具 -> 构建 npm，并勾选 使用 npm 模块 选项，构建完成后，即可引入组件。
步骤五 typescript 支持
如果你使用 typescript 开发小程序，还需要做如下操作，以获得顺畅的开发体验。
安装 miniprogram-api-typings
在 tsconfig.json 中增加如下配置，以防止 tsc 编译报错。
请将path/to/node_modules/@vant/weapp修改为项目的 node_modules 中 @vant/weapp 所在的目录。
引入组件
使用组件
引入组件后，可以在 wxml 中直接使用组件
在开发者工具中预览示例小程序
接着打开微信开发者工具，导入example目录的项目就可以预览示例了。
版权声明：
本文来源网络，所有图片文章版权属于原作者，如有侵权，联系删除。
本文网址：https://www.mushiming.com/mjsbk/11999.html