uni-app面试题

青铜小菜姬

已于 2023-05-28 15:31:14 修改

阅读量6.5k

点赞数 8

CC 4.0 BY-SA版权

文章标签： uni-app vue.js 前端

于 2023-04-16 10:02:51 首次发布

本文链接：https://blog.csdn.net/admin12345671/article/details/130178630

本文详细介绍了uni-app的优缺点，与vue和微信小程序的异同，包括uni-app的配置文件、组件、指令、本地缓存、生命周期、跳转方式、页面间传值等核心知识点，并提及了git基础命令和uni-app项目数据传递的多种方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.uniapp优缺点

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

2.一句话总的形容一下uniapp与vue和微信小程序的异同点

简单来讲Uni-app就是用着vue的指令和小程序的组件和API

vue和uni-app动态绑定一个变量的值为元素的某个属性的时候，会在属性前面加上冒号":";
小程序绑定某个变量的值为元素属性时，会用两个大括号{ {}}括起来，如果不加括号，为被认为是字符串。

3.uniapp的配置文件、入口文件、主组件、页面管理部分

pages.json
配置文件，全局页面路径配置，应用的状态栏、导航条、标题、窗口背景色设置等
main.js
入口文件，主要作用是初始化vue实例、定义全局组件、使用需要的插件如 vuex，注意uniapp无法使用vue-router，路由须在pages.json中进行配置。如果开发者坚持使用vue-router，可以在插件市场找到转换插件。
App.vue
是uni-app的主组件，所有页面都是在App.vue下进行切换的，是页面入口文件。但App.vue本身不是页面，这里不能编写视图元素。除此之外，应用生命周期仅可在App.vue中监听，在页面监听无效。
pages
页面管理部分用于存放页面或者组件
manifest.json
文件是应用的配置文件，用于指定应用的名称、图标、权限等。HBuilderX 创建的工程此文件在根目录，CLI 创建的工程此文件在 src 目录。
package.json
配置扩展。

4. Uniapp 中配置tabBar的方式及二级页面路径配置

pages.json
pages数组中第一项表示应用启动页

{
	//页面路径配置,未设置root则path默认完整路径
	"pages": [ 
		{
			"path": "pages/index/index",
			"style": {
				"navigationBarTitleText": "首页",
				"enablePullDownRefresh": true
			}
		}
	],
	//二级页面，设置了root根文件路径，则path可以简写
	"subPackages": [{
		"root": "pages/test-sub",
		"pages": [
			{
				"path": "login/index",
				"style": {
					"navigationBarTitleText": "登录"
				}
			}
		]
	}],
	//全局样式配置
	"globalStyle": {
		"navigationBarTextStyle": "black",
		"navigationBarTitleText": "uni-app",
		"navigationBarBackgroundColor": "#F8F8F8",
		"backgroundColor": "#F8F8F8"
	},
	"tabBar": {
		//tab样式和选中后效果
		"color"