素材编辑 | 宋大狮
排版运营 | 小唐狮
ONE 问题描述
今天要和大家分享的是关于微信小程序的问题，主要是阐述一下其最重要的一些技术点，让初学微信小程序开发的朋友，能够快速的上手做东西，以及对于之前接触过小程序的朋友，也能够起到快速回顾复习的目的。
需求： 简化小程序学习成本，最快的掌握小程序开发。
问题： 小程序开发的重要技术点。
TWO 技术要点
要点一：事件
事件绑定：
bindconfirm 回车事件 bindinput 监听输入框变化 bindtap 触摸点击事件 bindchange 监听状态改变
事件传参：
data-自定义属性="{{参数值}}"
事件对象参数：
target 触发事件组件的自定义属性 currentTarget 当前组件的自定义属性 detail 额外的信息，如：index、value
事件数据处理：
获取数据： this.data.属性
修改数据： this.setData({ data属性: 变量 })
要点二：页面跳转
跳转方式：
wx.navigateTo 普通页面 保留当前页面
wx.redirectTo 普通页面 关闭当前页面
wx.reLaunch 关闭所有页面
wx.switchTab tabBar页面
传参方式：
URL【url?参数1=值1&参数2=值2】 缓存【Storage、vuex】
接收参数：
onLoad(e) 缓存【Storage、vuex】
要点三：渲染
标签：
：div标签 ：span标签 : template标签，只能控制，不能加样式
<image src="" ></image >：图片 ：图标
<navigator url="#" redirect></navigator >：a标签 ：按钮
：输入框 ：多选框 ：单选框 ：下拉选择
显示隐藏：
wx:if 按需加载 hidden 显示隐藏
遍历：
wx:for wx:key
wx:for-item="渲染的别名" 默认item wx:for-index="索引别名" 默认index
要点四：接口
let that = this
wx.request({
url: '接口地址',
method:"get",
data: {
},
header: {
'content-type': 'application/json'
},
success (res) {
console.log(res)
that.data.list = res.data.dataList
}
})
THREE 知识总结
总结一： 问题复盘
从四个方面入手，事件、页面跳转、渲染、接口，基本掌握上述技术点，就可以进行基本的日常微信小程序开发了。而对于其他进阶技术点，可以在此基础上，在做项目的过程中，进行补充学习，效率刚刚的。
总结二： vue2父子传参方式盘点
父传子
1、props：在父组件中，给子组件绑定一个自定义属性，在子组件中，通过props进行接收
2、$parent：直接访问父组件实例的属性和方法
3、$attrs：在父组件中，给子组件绑定一个自定义属性，在子组件中，通过$attrs进行接收【与props不能共存】【vue新增的祖孙传参方式】
4、插槽
子传父
1、自定义事件：在父组件中，给子组件绑定一个自定义事件，绑定事件的值为接收参数的函数，在子组件中，通过$emit发送数据
2、$refs：直接访问子组件实例的属性和方法
3、$children 直接访问子组件实例的属性和方法【返回数组，必须遍历赋值后才能渲染】
FOUR 集思广益
欢迎大家对本问题留言或私信指教，一起学习提高！
- END -
ABOUT 关于作者
- 宋大狮 | 执着于理想，纯粹与当下
- 小唐狮 | 广场舞大军中最靓的仔
