微信原生小程序开发系统 第1篇
小程序的核心技术主要是三个:
Vue的MVVM和小程序MVVM对比
MVVM :
微信原生小程序开发系统 第2篇
Text组件 : 用于显示文本, 类似于span标签, 是行内元素
Button组件用于创建按钮,默认块级元素
open-type用户获取一些特殊性的权限,可以绑定一些特殊的事件
View视图组件 : 块级元素,独占一行,通常用作容器组件,和div差不多
scroll-view : 可以实现局部滚动
注 : 若要开启flex布局,须加上enable-flex这个属性
Image组件 : 用于显示图片
Swiper组件 => 用来做轮播图效果
model:value => 双向绑定功能
微信原生小程序开发系统 第3篇
小程序的宿主环境 => 微信客户端
ps : 宿主环境为了执行小程序的各种文件:wxml文件、wxss文件、js文件
双线程模型 :
项目配置文件 => 比如项目名称、appid等
页面配置
每一个小程序页面也可以使用 .json 文件来对本页面的窗口表现进行配置
页面中配置项在当前页面会覆盖 的 window 中相同的配置项
微信原生小程序开发系统 第4篇
openid : 当 在小程序 用微信功能登录时,每个微信都具备唯一标识openid
可把 openid 保存到数据库中,即使用户更换了手机,也能通过 openid 识别为同一用户
unionid : 在微信的不同产品之间可用来识别是否为同一用户
小程序的 openid 和 公众号的 openid,可能是不一样的,但是unionid一样
再开一个页面或窗口 => 进行账号绑定 || 手机号绑定
openid - unionid - 手机号 => 就建立了联系
登录操作
可以写到 的 onLaunch 中
也可以写到 页面.js 的 onLoad 中
微信原生小程序开发系统 第5篇
微信提供了专属的API接口,用于网络请求: (Object object)
每个微信小程序需要事先设置通讯域名,小程序只可以跟指定的域名进行网络通信
小程序登录后台 – 开发管理 – 开发设置 – 服务器域名
配置时需要注意 :
showToast 和 showLoading 只能同时显示一个
和 showToast => icon为loadind,展示的效果相同
但是可以手动控制关闭弹窗的时间
分享是小程序扩散的一种重要方式,小程序中有两种分享方式,通过 onShareAppMessage
此事件处理函数需要 return 一个 Object,用于自定义转发内容
微信原生小程序开发系统 第6篇
(1)技术定期优化,保证收益最大化;
(2)不需要软著,不需要上架;
(3)可以对私/对公结算;
(4)可以周结。
开发者注意:
AdSet是全网【首家】uniapp官方授权广告代理商,请勿相信其他广告公司说的H5套壳方式对接。否则:
· (1)服务器成本开销翻倍,出现白屏频率非常高,会导致广告费少一半以上,得不偿失。
· (2)uni官方严厉打击套壳行为,发现套壳将封禁APP。
uniapp对接AdSet的唯一条件是:媒体不能对接过uniad ( uni官方广告),一旦开通过uniad,媒体就无法再对接AdSet。返回搜狐,查看更多
微信原生小程序开发系统 第7篇
网址 : 小程序
可能会自动注册完成
ps : 也可以反向注册,在这里直接配置,文件夹会自动生成
直接修改data中的数据,不会引起页面的刷新
小程序和react中都不会,只有vue劫持了属性才能直接操作
ps : 修改data并且希望页面重新渲染,必须使用 ()
微信原生小程序开发系统 第8篇
跳转到 tabBar 页面
并关闭其他所有非 tabBar 页面,使用 navigateBack 无法退回
保留当前页面,跳转到应用内的某个页面
但是不能跳到 tabbar 页面
(Object object) => 关闭当前页面,返回上一页面或多级页面
在界面跳转过程中需要相互传递一些数据
使用URL中的query字段
在详情页内部拿到首页的页面对象,直接修改数据
在小程序基础库 开始支持events参数,也可以用于数据的传递
使用URL中的query字段进行传递,定义events对象
使用eventChanner,传递数据到上一个页面
navigator组件主要就是用于界面的跳转的,也可以跳转到其他小程序中
微信原生小程序开发系统 第9篇
页面样式的三种写法:行内样式、页面样式、全局样式
优先级依次是:行内样式 > 页面样式 > 全局样式
权重
rpx(responsive pixel): 可以根据屏幕宽度进行自适应,规定屏幕宽为750rpx
在iphone6上,屏幕宽度为375px,共有750个物理像素,1px === 2rpx
iphone6为标准,设计稿是375,1px === 2rpx => 设计稿16px,我们写32rpx
iphone6为标准,设计稿是750,1px === 1rpx => 设计稿20px,我们写20rpx
wx:if --- wx:elif --- wx:else
hidden属性:
hidden和wx:if的区别
hidden => 控制隐藏和显示是控制是否添加hidden属性,相当于display:none
wx:if => 是控制组件是否渲染的
block : 并不是一个组件,它仅仅是一个包装元素,不会在页面中做任何渲染,只接受控制属性
index : 遍历后在wxml中可以使用一个变量index,保存的是当前遍历数据的下标值
item : 数组中对应某项的数据
wx:for-item = ' ' => item 重命名
wx:for-index = ' ' => index 重命名
使用wx:for时,可以添加一个key来提供性能
wx:key 的值以两种形式提供 :
WXS(WeiXin Script)是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构
为什么要设计WXS语言
WXS使用的限制和特点 :
WXS有两种写法 :写在标签中 || 写在以.wxs结尾的文件中
WXS标签的属性 :
wxs :
['对象.属性']: 修改的值
微信原生小程序开发系统 第10篇
每个小程序都需要在 中调用 App 函数 注册小程序示例
注册App时,一般做如下事情 :
小程序的打开场景较多 :
在 onLaunch 和 onShow 生命周期回调函数中,会有options参数,其中有scene值
注意 : 定义在全局的数据不会响应式
共享的数据通常是一些固定的数据
在生命周期函数中,完成应用程序启动后的初始化操作
这里简单写写,详细的登录操作在下方
微信原生小程序开发系统 第11篇
某些组件会有自己特性的事件类型
input : bindinput || bindblur || bindfocus
scroll-view : bindscrolltowpper || bindscrolltolower
当某个事件触发时, 会产生一个事件对象, 并且这个对象被传入到回调函数中
target : 触发事件的元素
currentTarget : 处理事件的元素(大部分情况使用target)
touches : 当前屏幕上有多少个手指
changedTouches : 较上一个状态,改变了多少个手指
方式一 : 使用data-*
方式二 : 使用mark ( 版本以上
data- : 需要区分currnetTarget 和 target,一般使用currnetTarget即可
mark : 会自动合并所有的mark数据,不受影响
事件捕获 : 从外到内
事件冒泡 : 从内到外
总是先捕获,再冒泡