2020年前端笔试面试题(五.微信小程序)
五.微信小程序
1.微信小程序有几个文件
- WXML （WeiXin Markup Language）是框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。内部主要是微信自己定义的一套组件。
- WXSS (WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式，
- js 逻辑处理，网络请求
- json 小程序设置，如页面注册，页面标题及 tabBar。
- app.json 必须要有这个文件，如果没有这个文件，项目无法运行，因为微信框架把这个作为配置文件入口，整个小程序的全局配置。包括页面注册，网络设置，以及小程序的window 背景色，配置导航条样式，配置默认标题。
- app.js 必须要有这个文件，没有也是会报错！但是这个文件创建一下就行 什么都不需要写以后我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。
- app.wxss 配置全局 css
2.微信小程序组件封装
3.微信小程序怎样跟事件传值
- 给 HTML 元素添加 data-*属性来传递我们需要的值，然后通过 e.currentTarget.dataset 或onload的param参数获取。但 data -名称不能有大写字母和不可以存放对象
4.小程序的 wxss 和 css 有哪些不一样的地方？
- wxss的图片引入需使用外链地址；
- 没有 Body；样式可直接使用 import 导入。
5.小程序关联微信公众号如何确定用户的唯一性？
- 使用 wx.getUserInfo 方法 withCredentials 为 true 时 可获取 encryptedData，里面有 union_id。后端需要进行对称解密
6.微信小程序怎样获取用户信息
- 微信小程序获取用户信息需要用户授权，首先用户登陆微信小程序使用 wx.login 这个 API，然后通过 wx.getUserInfo 这个 API 在拿到用户信息
7.微信小程序与vue区别
- 生命周期不一样，微信小程序生命周期比较简单
- 数据绑定也不同，微信小程序数据绑定需要使用{{}}，vue 直接:就可以
- 显示与隐藏元素，vue中，使用 v-if 和 v-show 控制元素的显示和隐藏，小程序中，使用wx-if 和h idden 控制元素的显示和隐藏
- 事件处理不同，小程序中，全用 bindtap(bind+event)，或者 catchtap(catch+event) 绑定事件,vue：使用 v-on:event 绑定事件，或者使用@event 绑定事件。
- 数据双向绑定也不也不一样在 vue 中,只需要再表单元素上加上 v-model,然后再绑定 data中对应的一个值，当表单元素内容发生变化时，data中对应的值也会相应改变，这是 vue 非常 nice 的一点。微信小程序必须获取到表单元素，改变的值，然后再把值赋给一个 data中声明的变量。
- 取值也不一样，小程序中，通过 this.data.reason 取值，vue 中，通过 this.reason 取值，父子组件间的通信也不同。
