刷刷题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 设备的兼容性。
相关推荐
Highcharts.js几秒前
Highcharts 主流前端框架无缝集成指南
前端·vue.js·前端框架·highcharts·可视化图表
JAVA面经实录9172 分钟前
网络编程基础(Java Web/分布式前置·完整版)(十一)
java·前端·网络
IT_陈寒4 分钟前
搞不定JavaScript的数组去重?你可能漏了这两个坑
前端·人工智能·后端
三84413 分钟前
CSRF跨站请求伪造基础
前端·csrf
城管不管19 分钟前
MySQL 慢查询完整排查
java·服务器·jvm·数据库·mysql·spring·面试
岁岁种桃花儿1 小时前
Vue核心语法第十一篇:绑定样式
前端·javascript·vue.js
程序员黑豆8 小时前
Java类型推断完全指南:从var到菱形运算符,掌握使用限制与最佳实践
java·前端·ai编程
To_OC9 小时前
踩了个 TS 的坑之后,我终于把 type 和 interface 掰明白了
前端·react.js·typescript
GreenTea9 小时前
深度解读 Anthropic 多智能体报告:更强的模型 ≠ 更好的协调
前端·后端·算法