Uniapp及其他面试题汇总_uniapp面试题2023

一、uniapp优缺点？

优点:
a. 一套代码可以生成多端
b. 学习成本低,语法是vue的,组件是小程序的
c. 拓展能力强
d. 使用HBuilderX开发,支持vue语法
e. 突破了系统对H5调用原生能力的限制
缺点:
a. 问世时间短,很多地方不完善
b. 社区不大
c. 官方对问题的反馈不及时
d. 在Android平台上比微信小程序和iOS差
e. 文件命名受限

二、jQuery、vue、小程序、uni-app中的本地数据存储和接收？

	jQuery：
	存：$.cookie('key','value')
	取：$.cookie('key')
 
	vue：
	存储：localstorage.setItem（‘key’，‘value’）
	接收：localstorage.getItem（‘key’）
 
	微信小程序：
	存储：通过wx.setStorage/wx.setStorageSync写数据到缓存
	接收：通过wx.getStorage/wx.getStorageSync读取本地缓存，
 
	uni-app：
	存储：uni.setStorage({
   key:“属性名”，data:“值”}) //异步 
		uni.setStorageSync(KEY,DATA) //同步
	接收：uni.getStorage({
   key:“属性名”,success(res){
   res.data}}) //异步
		uni.getStorageSync(KEY) //同步
	移除：uni.removeStorage(OBJECT) //从本地缓存中异步移除指定 key。
		uni.removeStorageSync(KEY) //从本地缓存中同步移除指定 key。
	清除：uni.clearStorage() //清理本地数据缓存。
		uni.clearStorageSync() //同步清理本地数据缓存。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

三、vue,小程序,uni-app的生命周期？

	vue：
	beforeCreate（创建前）
	created（创建后）
	beforeMount(载入前，挂载）
	mounted（载入后）
	beforeUpdate（更新前）
	updated（更新后）
	beforeDestroy（销毁前）
	destroyed（销毁后）
	小程序/uni-app： 
	1. onLoad：首次进入页面加载时触发，可以在 onLoad 的参数中获取打开当前页面路径中的参数。
	2. onShow：加载完成后、后台切到前台或重新进入页面时触发
	3. onReady：页面首次渲染完成时触发
	4. onHide：从前台切到后台或进入其他页面触发
	5. onUnload：页面卸载时触发
	6. onPullDownRefresh：监听用户下拉动作
	7. onReachBottom：页面上拉触底事件的处理函数
	8. onShareAppMessage：用户点击右上角转发
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

四、uniapp中组件生命周期？

五、路由与页面跳转？

uniapp的页面跳转和小程序是一样的，都是跳转配置好的页面路径， 并且tab页面也是需要使用switchTab才能实现跳转，总体上和小程序保持一致，对于熟练小程序的朋友上手没有难度，反之，当你习惯了uniapp的页面切换组件后上手小程序也很快。

六、跨端适配—条件编译？

开发者按照 uni-app 规范开发即可保证多平台兼容，大部分业务均可直接满足。但每个平台有自己的一些特性，因此会存在一些无法跨平台的情况。因此就有了条件编译这个模式，不仅是js逻辑代码，template和css样式都可以设置成在某个环境中生效，在其他环境不生效

//template
<!--  #ifdef  MP-WEIXIN -->
<!--  只在小程序中生效 -->
<view>我是微信小程序</view>
<!--  #endif -->
 
<!--  #ifdef  APP-PLUS -->
<!--  只在 app 中生效 -->
<view>我是 app </view>
<!--  #endif -->
 
//js
// #ifndef H5
// 表示只有 h5 不使用这个 api
uni.createAnimation(OBJECT)
// #endif
 
//css
/* #ifdef  MP-WEIXIN */
/*  只在小程序中生效  */
.header {
   
	color:red
}
/*  #endif  */
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

七、简述 rpx、px、em、rem、%、vh、vw的区别？

	rpx	相当于把屏幕宽度分为750份，1份就是1rpx
	px	绝对单位，页面按精确像素展示
	em	相对单位，相对于它的父节点字体进行计算
	rem	相对单位，相对根节点html的字体大小来计算
	%	一般来说就是相对于父元素
	vh	视窗高度，1vh等于视窗高度的1%
	vw	视窗宽度，1vw等于视窗宽度的1%
1
2
3
4
5
6
7

八、jq、vue、uni-app、小程序的页面传参方式区别？

	1、 jq传参
	通过url拼接参数进行传参。
	2、 vue传参
	一、 vue可以通过标签router-link跳转传参，通过path+路径，query+参数
	二、 也可以通过事件里的this.$router.push（{
   }࿰
1
2
3
4
5