#UniApp篇:uni面试题

• 编译#ifdef #ifndef----夸端适配

• uniapp工作原理—将vue.js的模版语法转换为各个平台所支持的原生组件，在通过引擎的渲染器将其渲染到各个平台上。

• 应用生命周期

  https://zh.uniapp.dcloud.io/collocation/App.html#applifecycle

  // 初始化完成时触发---全局只触发一次
  onLanuch 
  // 从后台进入前台显示
  onShow
  // 从前台进入后台或者切换tab
  onHide
  // 等页面的生命周期
  

• 页面的生命周期

  // 监听页面初始化
  onInit
  // 监听页面加载
  onLoad
  // 监听页面显示
  onShow
  // 监听页面初次渲染完成
  onUload // 
  

• 组件生命周期

  beforeCreate
  created
  beforeMount
  mounted
  beforeUpdate
  updated
  beforeDestory
  destoryed
  

• 数据缓存

  // 同步缓存
    uni.setStorage({
      key: 'storage_key',
      data: 'hello',
      success: function () {
        console.log('success');
      }
    });
  
  // 异步缓存
    uni.setStorageSync(key,data)
    try {
      uni.setStorageSync('storage_key', 'hello');
    } catch (e) {
      // error
    }
  
  

• 配置文件部分

  // main.js 初始入口文件
  // App.vue 应用配置
  // pages.json 配置页面路由，导航台哦，选项卡等打包信息
  

• 路由和跳转

  uni.navgateTo跳转页面 保留当前页面
  uni.redirectTo销毁当前页 跳转到指定页面
  uni.switchTab跳转至tab页面，并关闭其它所有非tabBar页面
  uni.reLaunch销毁所有页面 跳转至指定页面
  uni.navigateBack关闭当前页面返回上一页面
  

• uniapp和vue和小程序之间的关系

  UniApp 是一个基于 Vue.js 的跨平台开发框架，它可以将同一套代码编译成多个平台的小程序应用，开发者可以使用 Vue.js 的语法和特性来开发跨平台的应用程序，并且可以通过 UniApp 提供的统一规范和 API 来实现不同平台的功能。
  

• 说几个uniapp常用的组件

  // view视图容器
  // text文本
  // button按钮
  // image图片
  // mapd地图
  // swiper轮播图
  // icon图标
  

• tabBar 中的 list 是一个数组，只能配置最少2个、最多5个 tab，tab 按数组的顺序排序。

• 传递参数的形式

  1. URL 参数：
    将参数直接附加在 URL 的末尾，形成查询字符串的形式，例如 http://example.com/api?param1=value1&param2=value2。
    这种方式简单直接，适用于 GET 请求，但参数的长度有限制
  2. body
  3. 请求头 authorization
  4.路径传参数
  将参数直接嵌入到 URL 路径中，通常用于 RESTful 风格的 API 设计中，表示资源的唯一标识符。
    例如 /api/users/:userId，其中 :userId 表示动态路径参数，可以在路由匹配时被实际的值替换。
  

• Vue uni-app 小程序页面传递参数方式和区别

  1. vue router-link router跳转 url拼接 query  params
  2.uniapp 小程序通过页面跳转后面拼接参数 globalData
  

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

  打包app(android/ios)不考虑跨域，因为app内的数据请求不受限
  打包小程序需要在小程序后台配置合法域名
  打包H5需要在上线服务器搭代理或者打包后的项目上传至同源服务器
  

• uniapp开发需要注意什么

  1. 如果使用了自定义导航栏，打包小程序或app时需要预留顶部手机状态条高度
  2. 注意uniapp中api在各个平台的兼容性
  3. 为了兼容多端运行，建议使用flex布局
  4. 使用uniapp开发小程序注意代码包限制2M大小，必要时可以使用分包
  

• Uni-app在非h5端上运行为什么要在架构上分为逻辑层和视图层

  保持一致的开发体验和性能表现
  

• 描述一下在Uniapp中如何实现动态路由

• 上传文件—uni.uploadFile(obj)

• 获取地理位置—uni.getLocation(ob)

• 如何监听页面滚动—onPageScroll—页面在垂直方向已滚动的距离（单位px）

• Uni-app分包策略

  为什么
    微信小程序之所以需要分包，主要为了解决小程序官方限制了珠宝提及和总体积大小，如果应用体积超限，我们将不能发不到应用官方。
  
    微信小程序总体大小限制为 20 MB，即所有的代码文件、图片资源文件、音频文件等在上传时不得超过 20 MB。
  
  怎么做
    第一步：pages.json
    "subPackages":[
      {
        "root":"packageA",  //分包的根目录
        "pages":[{"path":"detail/index"}]  //该分包下的所有页面
      }
    ]
    1. 使用subpackages进行分包路径声明，subpackages外的目录会被打到主包中
    2. tabBar里面的路径必须放到主包里面
    3. 不同的分包之间的资源不能相互应用，但都可以引用主包中的资源
    第二部： manifest.json中加入 "optimization": {"subPackages": true}
  好处
    1。 提高首页加载速度；
    2. 优化性能 
    3. 分包预下载
    怎么分
    根据功能模块
    根据资源引用
    分包预下载配置 进入小程序某个页面时，框架自动预下载可能需要的分包，提升进入后续分包页面时的启动速度。 在pages.json文件的preloadRule节点中配置分包预下载规则，预下载的行为，会在进入指定的页面时触发。
    {
    "preloadRule": { // 分包预下载规则配置
      "packageA/detail/index": { // 触发分包预下载的页面路径
        // network 表示在指定的网络模式下进行预下载
        // 可选值为：all（不限网络） 和 wifi（仅 wifi 模式下进行预下载）
        // 默认值为：wifi
        "network": "all",
        // packages 表示进入页面后预下载哪些分包
        // 可以通过 root 或 name 指定预下载哪些分包
        // 如果是 __APP__ 表示下载所有包
        "packages": ["packageA"]
      }
    },
  }
  

原文地址：https://blog.csdn.net/weixin_47075554/article/details/136374333

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！