位置: IT常识 - 正文
目录
谈谈你对uni-app的理解
推荐整理分享uniapp 高频面试题合集(uniapp面试题必问的坑),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:uniapp面试题必问,uniapp高频面试题,uniapp前端面试题,uniapp常见面试题,uniapp常见面试题,uniapp面试题及答案2020,uniapp面试题必问的坑,uniapp常见面试题,内容如对您有帮助,希望把文章链接给更多的朋友!
uni中如何为不同的平台设置不同的代码
条件注释的作用和使用方法
条件注释定义
条件注释的语法
uniapp中封装接口请求相较于微信小程序有什么要注意的
uniapp中为什么会出现跨域问题,如何解决
详情请点击此处
uni中如何为不同的平台设置不同的代码使用条件注释
条件编译是用特殊的注释作为标记,在编译时根据这些特殊的注释,将注释里面的代码编译到不同平台。
条件注释的作用和使用方法uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-app 规范开发即可保证多平台兼容,大部分业务均可直接满足。
但每个平台有自己的一些特性,因此会存在一些无法跨平台的情况。
大量写 if else,会造成代码执行性能低下和管理混乱。编译到不同的工程后二次修改,会让后续升级变的很麻烦。在 C 语言中,通过 #ifdef、#ifndef 的方式,为 windows、mac 等不同 os 编译不同的代码。 uni-app 参考这个思路,为 uni-app 提供了条件编译手段,在一个工程里优雅的完成了平台个性化实现。
条件注释定义条件编译是用特殊的注释作为标记,在编译时根据这些特殊的注释,将注释里面的代码编译到不同平台。
条件注释的语法写法:以 #ifdef 或 #ifndef 加 %PLATFORM% 开头,以 #endif 结尾。
#ifdef:if defined 仅在某平台存在#ifndef:if not defined 除了某平台均存在%PLATFORM%:平台名称uniapp中封装接口请求相较于微信小程序有什么要注意的如果uniapp要在web端进行适配,要注意请求跨域问题---需要配置代理
uniapp中为什么会出现跨域问题,如何解决原因
uniapp在web端进行适配时,会产生跨域问题
解决
配置代理
封装统一的http请求
针对于uni.request我们可以沿用之前我们在小程序中的封装思路,封装http请求
封装的目的
发送请求的时候调用更简洁添加一些通用的配置(超时时间,请求头)。 调用者没有传入配置的时候用默认的,调用者传入了相同,优先使用调用者改成使用promise解决异步问题统一维护域名添加请求拦截器,在所有请求之前加一些通用的操作代码响应之前,进行一些通用的操作封装代码
const proxy = { "/api":{ target:"http://59.111.104.104:8086", pathRewrite:'^/api' }}//http://59.111.104.104:8086/course/// 作用: 根据当前的url和代理得到完整url// 输入: 当前的url// 输出: 完整的urlfunction getUrl(url){ for(let key in proxy){ if(url.startsWith(key)){ // 匹配到了代理 if(proxy[key].pathRewrite){ // 需要进行前缀重写 url = url.replace(new RegExp(proxy[key].pathRewrite),"") } url = proxy[key].target + url break; } } ///返回处理后的url return url;}function getHeader(header={}){ return { "Content-Type":"application/x-www-form-urlencoded", // #ifndef H5 "Cookie":uni.getStorageSync("cookie"), // #endif ...header }}function request(options){ return new Promise((reslove,reject)=>{ if(!options.header) options.header = {} const header = getHeader(options.header); // 请求之前进行一些操作 // 加载代理 // #ifndef H5 options.url = getUrl(options.url) // #endif console.log(options.url) uni.request({ // 设置超时时间10s timeout:10000, ...options, header, success(res) { // 响应之前进行一些操作 reslove(res) }, fail(err) { reject(err) } }) })}export function get(url,options){ return request({ url, ...options, method:"GET" })}export function post(url,data,options){ return request({ url, data, ...options, method:"POST" })}//配置代理//vue.config.jsmodule.exports = { devServer: { proxy: { "/api": { "target": "https://wk.myhope365.com", "pathRewrite": { "^/api": "" } } } }}上一篇:CLIP(Contrastive Language-Image Pre-Training)简介
友情链接: 武汉网站建设