小程序面试题
1.小程序有几个文件。
页面组成
- wxml 小程序的页面结构模板
- wxss 小程序页面样式文件
- json 页面配置
- js 逻辑结构
全局
app.js 入口文件
app.json 全局配置文件
app.wxss 全局样式
2.小程序怎么跟随事件传值
在 ⻚⾯标签上通过 绑定 data-key = value , 然后绑定点击通过 e.currentTarget 科润弹害
的.dataset.key 来获取标签上 绑定的值。
3 ⼩程序WXSS与CSS 的区别
wxss 背景图⽚只能引⼊外链,不能使⽤本地图⽚
⼩程序样式使⽤ @import 引⼊ 外联样式⽂件,地址为相对路径。
尺⼨单位为 rpx , rpx 是响应式像素,可以根据屏幕宽度进⾏⾃适应。
4 ⼩程序的⽣命周期函数
小程序生命周期
1.onLaunch()小程序初始化的生命周期钩子函数
2.onShow ()小程序启动或者从后台切入到前台
3.onHide() 切入到后台
页面生命周期函数
onLoad()监听页面加载 执行1次
onShow()监听页面的展示 执行n次
onHide() 监听页面的隐藏 执行n次
onReady()初次渲染完成 执行1次
onUnload()页面关闭
5 ⼩程序怎么实现下拉刷新
两种⽅案 ⽅案 ⼀ :
通过在 app.json 中, 将 "enablePullDownRefresh e tab 铺楠博发失": true, 开启全局下拉刷新。 或者通过在 组件 .json , 将 "enablePullDownRefresh": true, 单组件下拉刷新。
⽅案⼆:
scroll-view :使⽤该滚动组件 ⾃定义刷新,通过 bindscrolltoupper 属性, 当滚动到顶部/左边,会触发
scrolltoupper 事件,所以我们可以利⽤这个属性,来实现下拉刷新功能。
6.⼩程序的双向绑定和Vue哪⾥不⼀样?
⼩程序 直接使⽤ this.data.key = value 是 不能更新到视图当中的。 必须使⽤ this.setData({ key :value })来更新值。
7.bindtap和catchtap区别
都是点击事件 bindtap不能阻止冒泡 catchtap 能阻止冒泡
8. ⼩程序有哪些传递数据的⽅法
1.使⽤全局变量
在 app.js 中的 this.globalData = { } 中放⼊要存储的数据。 在 组件.js 中, 头部 引⼊ const app = getApp(); 获取到全局变量 直接使⽤ app.globalData.key 来进⾏赋值和获取值。
测试"--拿到传值 get(e){ console.log(e.currentTarget.dataset.name) }
2. 使⽤路由
wx.navigateTo 和 wx.redirectTo 时,可以通过在 url 后 拼接 + 变量, 然后在⽬标⻚⾯的onLoad周期中,通过参数来获取传递过来的值。
3. 使⽤本地缓存
9.小程序5个路由函数的区别
wx.navigateTo() : 保留当前⻚⾯,跳转到应⽤内的某个⻚⾯。但是不能跳到 tabbar ⻚⾯
wx.redirectTo() : 关闭当前⻚⾯,跳转到应⽤内的某个⻚⾯。但是不能跳转到 tabbar ⻚⾯
wx.switchTab() : 跳转到 TabBar ⻚⾯,并关闭其他所有⾮ tabBar ⻚⾯
wx.navigateBack() : 关闭当前⻚⾯,返回上⼀⻚⾯或多级⻚⾯。可通过 getCurrentPages() 获取当前的⻚⾯栈,决定需要返回⼏层
wx.reLaunch() : 关闭所有⻚⾯,打开到应⽤的某个⻚⾯。
10.app.json全局配置⽂件描述
pages : ⽤于存放当前⼩程序的所有⻚⾯路径
window : ⼩程序所有⻚⾯的顶部背景颜⾊,⽂字颜⾊配置。
tabBar : ⼩程序底部的 Tab ,最多5个,最少2个。
11. 如何封装⼩程序请求
1. 在项目中新建http目录,新建http.js
2. 在http.js中封装get和post方法
3. 在get方法中先用wx.showToast()提示数据加载,然后返回一个promise,在promise的回调函数中通过wx.request()来请求数据,在请求成功的回调中先关闭弹框,再调用promise的resolve方法,传递返回的数据
4. export default返回封装的方法
5. 在页面中通过import 导入方法,就可以直接使用了
12 ⼩程序运⾏机制
热启动 :假如⽤户已经打开了某个⼩程序,在⼀定时间内再次打开⼩程序的话,这个时候我们就不再需要重新启动了,这需要把我们把后台打开的⼩程序切换到前台来使⽤。
冷启动 :⽤户⾸次打开⼩程序或被微信主动销毁再次打开的情况,此时⼩程序需要重新加载启动。
13. 小程序组件通信
1. 父传子
1. 在父组件中的子组件标签绑定属性 传递要传输的变量
2. 在子组件中用properties来接收数据 可以直接使用
3.改变组件的properties数据使用setData()
2. 子传父
1. 在父组件的子组件标签上定义一个事件,绑定要执行的方法
2. 在子组件中通过 this.triggerEvent来触发自定义事件,传递数据
3. 在父组件中接收传递的数据,通过事件对象e来接收
3、获取其他组件数据
this.selectComponent 死赖科的 跑免的 (".类名") 想获取哪个组建的数据获取哪个组件的数据
14. 分包加载是什么
分包加载就是在小程序加载的时候不用全部把所有的页面加载完成,可以使用分包加载实现页面的按需加载。在app.json中 添加 subPackages 撒泼拍申 选项、
15.⼩程序wx:if和 hidden的区别
wx:if : 有更⾼的切换消耗。
hidden : 有更⾼的初始渲染消耗。
使⽤
频繁切换使⽤ hidden , 运⾏时条件变化使⽤ wx: if