刷刷题32(uniapp初级实际项目问题-1)

1. Uniapp 的跨平台原理是什么?

Uniapp 基于 Vue.js 语法,通过编译时将代码转换为各平台(小程序、H5、App等)的原生代码。例如,小程序会转为 wxml/wxss/js,H5 转为 HTML/CSS/JS,App 通过 Weex 或原生渲染引擎处理,实现"一套代码,多端运行"。


2. Uniapp 中如何实现页面跳转?列举至少两种方式。

  • uni.navigateTo:保留当前页面,跳转到新页面(可返回)。
  • uni.redirectTo:关闭当前页面,跳转到新页面(不可返回)。
  • 其他:uni.switchTab(切换 Tab 页)、uni.reLaunch(重启到新页面)等。

3. Uniapp 的生命周期有哪些?应用生命周期和页面生命周期有何区别?

  • 应用生命周期 ‌:onLaunch(初始化)、onShow(启动/从后台进入前台)、onHide(进入后台)。
  • 页面生命周期 ‌:onLoad(加载)、onShow(显示)、onReady(渲染完成)、onHide(隐藏)、onUnload(卸载)。
    区别‌:应用生命周期管理全局状态,页面生命周期管理单个页面的状态。

4. 如何在 Uniapp 中发起网络请求?

使用 uni.request 方法:

javascript 复制代码
uni.request({
  url: 'https://api.example.com/data',
  method: 'GET',
  success: (res) => { console.log(res.data); },
  fail: (err) => { console.error(err); }
});

5. Uniapp 如何处理不同平台的样式或逻辑差异?

使用‌条件编译‌:

arduino 复制代码
// #ifdef MP-WEIXIN
console.log('仅微信小程序生效');
// #endif

// #ifdef H5
console.log('仅H5生效');
// #endif

6. 如何实现全局状态管理?列举至少两种方式。

  • Vuex ‌:通过 store 管理全局状态。
  • 全局变量 ‌:在 App.vue 中定义全局变量,通过 getApp().globalData 访问。
  • 事件总线 ‌:使用 uni.$onuni.$emit 跨组件通信。

7. Uniapp 中常用的 UI 组件库有哪些?

  • uni-ui ‌:官方扩展组件库(如 <uni-card><uni-icons>)。
  • uView UI‌:第三方高性能组件库。
  • Vant Weapp‌:适配小程序端的组件库(需条件编译)。

8. 如何优化 Uniapp 应用的性能?

  • 减少 setData 频率和数据量。
  • 使用图片懒加载(<image lazy-load>)。
  • 分包加载(subPackages 配置)。
  • 避免频繁操作 DOM,善用 v-ifv-show

9. 如何实现本地数据缓存?

使用 uni.setStorageSyncuni.getStorageSync

arduino 复制代码
// 存储
uni.setStorageSync('key', 'value');
// 读取
const value = uni.getStorageSync('key');
// 删除
uni.removeStorageSync('key');

10. Uniapp 打包为 App 时需要注意什么?

  • 配置应用图标(manifest.json 中设置)。
  • 处理原生功能(如摄像头、定位)需添加权限声明。
  • 使用 HbuilderX 进行云打包或离线打包。
  • 测试不同 Android/iOS 设备的兼容性。
相关推荐
JYeontu20 分钟前
肉眼难以分辨 UI 是否对齐,写个插件来辅助
前端·javascript
fox_20 分钟前
别再踩坑!JavaScript的this关键字,一次性讲透其“变脸”真相
前端·javascript
盛夏绽放21 分钟前
uni-app Vue 项目的规范目录结构全解
前端·vue.js·uni-app
少卿29 分钟前
React Native Vector Icons 安装指南
前端·react native
国家不保护废物34 分钟前
Vue组件通信全攻略:从父子传到事件总线,玩转组件数据流!
前端·vue.js
写不来代码的草莓熊1 小时前
vue前端面试题——记录一次面试当中遇到的题(9)
前端·javascript·vue.js
JinSo2 小时前
pnpm monorepo 联调:告别 --global 参数
前端·github·代码规范
程序员码歌2 小时前
豆包Seedream4.0深度体验:p图美化与文生图创作
android·前端·后端
urhero2 小时前
工作事项管理小工具——HTML版
前端·html·实用工具·工作事项跟踪·任务跟踪小工具·本地小程序
二十雨辰2 小时前
eduAi-智能体创意平台
前端·vue.js