微信小程序使用方法

一.在网页注册小程序账号(在未注册的情况下)

1.如果你还没有微信公众平台的账号,请先进入微信公众平台首页,点击 "立即注册" 按钮进行注册。我们选择 "小程序" 即可。

接着填写账号信息,需要注意的是,填写的邮箱必须是未被微信公众平台注册、未被个人微信号绑定的邮箱,而且每个邮箱仅能申请一个小程序。

激活邮箱之后,选择主体类型为 "个人类型",并按要求登记主体信息。主体信息提交后不可修改,该主体将成为你使用微信公众平台各项服务和功能的唯一法律主体与缔约主体,在后续开通其他业务功能时不得变更或者修改。

二,微信开发者工具

1.下载微信web开发者工具,根据自己的操作系统下载对应的安装包进行安装即可。

2.在进入小程序后,将会呈现以下页面

3,项目组成

4.新建页面

  1. 在pages文件夹右键建立新的文件夹
  2. 在文件中右键新建页面
  3. 哪个page在最上面,默认显示哪页
  4. json要求严格语法,不能有多余的注释和逗号

页面配置:

"enablePullDownRefresh": true,  允许下拉刷新
"backgroundTextStyle": "dark",  背景文字颜色
"backgroundColor":"#f70", 		背景颜色
"usingComponents":{}       		组件

三.基本语法

1.文本渲染

{{ msg}}可以执行简单的js表达式
{{2+3}}
{{msg.length}}

2.条件渲染

html 复制代码
wx:if=""
wx:elif=""
wx:else

3.列表渲染

html 复制代码
wx:for="{{list}}"
wx:key="index"
	{{item}}
	{{index}}

4.自定义列表渲染

html 复制代码
定义item与index的名称
wx:for="{{list}}}"
wx:for-item="myitem"
wx:for-index="myidx"
{{myidx}}
{{myitem}}

5.wxss

html 复制代码
默认单位是rpx
750rpx 等于一个屏幕的宽
375就是50%的宽

6.事件

html 复制代码
bindInput     表单输入时
bindconfirm    表单输入确认
bindtap      点击时候

7.内置组件

html 复制代码
view         组件块组件
text         组件行内组件
button       组件按钮
input        组件表单

8.事件的传参

html 复制代码
<button data-msg="xxx" bindtap="tapHd">
获取事件的参数  e.target.dataset.msg

9.表单的绑定

html 复制代码
<input value="{{s1}}" bindinput="inputHd">
inputHd(e){
 this.setData({s1:e.detail.value})
}
表单的值获取:e.detail.value

10.生命周期

html 复制代码
onLoad 							页面加载完毕
onPullDownRefresh 				下拉刷新
onReachBottom					 触底更新
相关推荐
HerayChen1 小时前
微信小程序混合 h5 wx.miniProgram是 undefined
微信小程序·小程序·h5
耶啵奶膘5 小时前
uniapp+vue2全局监听退出小程序清除缓存
小程序·uni-app
中云DDoS CC防护蔡蔡8 小时前
微信小程序被攻击怎么选择高防产品
服务器·网络安全·微信小程序·小程序·ddos
井眼11 小时前
微信小程序-prettier 格式化
微信小程序·小程序
qq_174482857514 小时前
springboot基于微信小程序的旧衣回收系统的设计与实现
spring boot·后端·微信小程序
wqq_99225027714 小时前
springboot基于微信小程序的食堂预约点餐系统
数据库·微信小程序·小程序
licy__20 小时前
微信小程序登录注册页面设计(小程序项目)
微信小程序·小程序
wqq_9922502771 天前
springboot基于微信小程序的农产品交易平台
spring boot·后端·微信小程序
说私域2 天前
基于“开源 2+1 链动模式 S2B2C 商城小程序”的社区团购运作主体特征分析
大数据·人工智能·小程序
HUODUNYUN2 天前
小程序免备案:快速部署与优化的全攻略
服务器·网络·web安全·小程序·1024程序员节