uniapp面试题

2,721 阅读5分钟

1, 简单介绍一下uniapp, 及与vue和小程序之间的关系

uniapp简单来说就是vue和小程序的结合体, 它使用vue的结构、指令、语法,和小程序的组件、API, 它既能编写各种小程序,又能实现vue移动端网站及APP

 

2, uniapp的优缺点

优点

一套代码可以生成多端应用,降低了开发成本

语法是vue的,组件是小程序的,学习成本低

扩展能力强,使用HBuilderX开发,插件库丰富

突破了系统对H5调用原生能力的限制

缺点:

问世时间短,很多地方还不完善

社区不大

官方对问题的反馈不及时

在安卓平台上的运行效率比小程序和iOS差

文件命名受限

 

3, 说几个uniapp中常见的组件

uniapp中的组件和小程序组件是一致的, 如view视图容器,icon图标,text文本,button按钮,image图片,map地图,camera相机,swiper轮播图 等等

 

4, uniapp中的指令有哪些

uniapp的指令系统和vue指令是一致的,有 v-for循环,v-if/v-show条件渲染,v-model双向绑定,v-on事件绑定,v-bind属性绑定 等等

 

5, uniapp如何实现本地缓存

uniapp的本地存储和小程序类似,使用uni.setStorage()存数据,使用uni.getStorage()取数据

 

6, uniapp中的有那些页面跳转方式

uniapp中的路由系统和小程序一致,可以使用navigator组件跳转 或者使用编程式API跳转

uni.navigatTo() 只能跳转非tabbar页面,不会关闭当前页,可以返回

uni.redirectTo() 只能跳转非tabbar页面,会关闭当前页

uni.releanch()  关闭所有已打开的页面, 跳转到任意页面

uni.switchTab()   只能从tab页面切换到tab页面

 

7, 列举uniapp应用的生命周期

onLaunch——当uni-app 初始化完成时触发(全局只触发一次)

onShow——当 uni-app 启动,或从后台进入前台显示

onHide——当 uni-app 从前台进入后台

onError——当 uni-app 报错时触发

onUniNViewMessage——对 nvue 页面发送的数据进行监听,可参考 nvue 向 vue 通讯

onUnhandledRejection——对未处理的 Promise 拒绝事件监听函数(2.8.1+)

onPageNotFound——页面不存在监听函数

onThemeChange——监听系统主题变化

 

8, 列举uniapp页面的生命周期

uniapp页面的生命周期与小程序页面生命周期保持一致

onLoad, onReady, onShow, onHide, onUnload, onResize

 

9, 列举uniapp组件的生命周期

uniapp组件的生命周期与vue组件生命周期保持一致

beforeCreate,  created,  beforeMount,  mounted,

beforeUpdate,  updated,  beforeDestroy,  destroyed

 

10, uniapp如何实现跨端适配

我们按照 uni-app 规范开发即可保证多平台兼容,大部分业务均可直接满足。

但每个平台有自己的一些特性,因此会存在一些无法跨平台的情况。此时可以使用条件编译模式,它可以实现js逻辑代码,template和css样式在某个环境中生效,在其他环境不生效

条件编译 以 #ifdef+环境名 开头  以#endif 结尾, 限制一段代码只在某个平台存在

以 #ifndef+环境名 开头  以#endif 结尾, 限制一段代码除了某平台均存在

 

11, vue、uni-app、小程序的页面传参方式区别

vue页面传参: 通过router-link标签或router对象路由跳转传参, url拼接传值 ,动态url传值, query对象传值,命名路由params传值 这四种传值方式

uniapp和小程序页面传参: 通过跳转路径后面拼接参数进行传值

 

12, uni-app的手机端用户体验如何?

使用uni-app开发的微信小程序,和直接开发微信小程序相比性能没有明显差别,因为uni-app输出到微信时也是编译为wxml格式。uni-app编译到微信使用的是mpvue框架,这个是业内广泛使用的成熟框架。

uni-app打包成App后的体验和微信小程序一样好,在某些场景下更好;微信小程序的Hybrid应用框架是业内体验上的标杆,这种体验足以承载一线互联网开发商获得上亿用户。

uni-app内置预载机制,加载新页面速度极快,可实现无白屏极速渲染。

uni-app在App端还支持weex原生渲染(nvue),左右拖动长列表等复杂场景依然可实现高流畅性。

 

13, uniapp打包发布时如何处理请求跨域问题

打包app(Android/iOS)不考虑跨域, 因为app内的数据请求不受跨域限制

打包小程序需要在小程序后台配置合法域名,

打包H5需要在上线服务器搭代理或者把打包后的项目上传至同源服务器

 

14, uniapp开发需要注意哪些问题

如果uniapp使用了自定义导航栏,打包小程序或app时,需要预留顶部手机顶部状态条高度

注意uniapp中的API在个平台的兼容性, 如背景音频API不支持H5端,不能在浏览器测试

dom元素信息通过API:uni.createSelectorQuery()获取,则兼容全部平台

为兼容多端运行,建议使用flex弹性布局进行开发

使用uniapp开发小程序时,注意代码包限制2M大小,必要时可使用分包

App端和H5端支持v-html,其他端不支持v-html