loyd3的博客

在实际开发中判断运行环境，通常用于调用不同环境的服务端API接口地址。在开发环境下需要调用测试接口，在生产环境下需要调用正式接口，这时需要判断当前的运行环境，从而调用不同的接口。uni-app可通过process.env.NODE_ENV判断当前运行环境，在HBuilder Xzhong ，选择“运行”命令编译出的是开发环境，选择“发行”命令编译出的是生产环境，代码示例如下：在实际开发中不可能只有这两个环境，还需要多环境配置，如测试环境，预览环境等。其配置方式与Vue一样，也需要配置package.j

uni.createInnerAudioContext能够创建并返回内部audio上下文innerAudioContext对象，从而代替audio组件。为了兼容性和音质，推荐使用mp3格式。

map组件的makers代表标记点用于在地图上显示标记的位置，值是一个数组类型，可以有多个标记。

当range是一个Array时，通过range指定Object中key的值作为选择器的显示内容。: 当mode为selector或multiSelector时，range有效。当picker的mode为selector或没有mode属性时，为普通选择器。

关于textarea要注意的是，在微信小程序，百度小程序及字节跳动小程序中，textarea是原生组件，层级高于前端组件，请勿在scroll-view，swiper，picker-view，movable-view中使用textarea组件，覆盖textarea需要使用cover-view。因此，使用rich-text组件输出时并不能显示换行，需要将。是windows操作系统的换行，为了兼容，须将两者中的换行都替换。在实际开发中，textarea组件中的换行符为。代表UNIX操作系统中的换行，

App-nvue 和支付宝小程序不支持 HTML String 方式，仅支持直接使用节点列表即 Array 类型，如要使用 HTML String，则需自己将 HTML String 转化为 nodes 数组，可使用 html-parser (opens new window)转换。有时候展现的图片也是没有样式的，导致图片会按照原始大小显示，超出界面框架。nodes 值为 HTML String 时，在组件内部将自动解析为节点列表，rict-text可以支持部分HTML节点及属性。

注意，一定要使用v-if，不要用v-show，因为v-if不会将元素渲染到视图中。由于scroll-view组件内部并没有input组件，因此不会卡顿。还要注意的是，这里的input不是HTML的input元素，而是。在开发微信小程序时，scroll-view组件中会嵌套多个input组件，在真机测试上会出现页面卡顿问题，这属于微信小程序底层问题，目前没有很好的解决方案。因此，需要从另一个角度解决问题，例如，

这里可以使用uni.getSystemInfoSync()的mode属性获取手机型号，判断是否在iPhone X中运行，如果是，则重新设定padding-top的值即可。开发微信小程序时设置为自定义导航，在iPhone X这种有刘海屏的手机中预览会发现自定义导航与“刘海”之间的距离对比原生导航有些差异，用户体验不是很好。

uni.setStorageSync()方法的第一个参数是属性，第二个参数是值，与H5的localStorage使用方式是一样的。跳转到tabBar页面时是不能传参的但是实际开发中需要在跳转tabBar页面时进行传参，这是可以。, uni-app的本地缓存是。

getCurrentPages() 函数用于获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面。使用getCurrentPages()方法获取栈中的页面数，如果大于等于10层，则使用redirectTo()方法进行跳转。微信小程序为了解决性能问题，使用navigateTo()方法跳转，其页面限制为10层。每次使用navigateBack()方法返回时，就会减少一层页面栈。因为每次使用navigateTo()方法跳转页面都会。，页面栈越多，性能越差。

rpx是一种根据屏幕宽度自适应的动态单位。以750宽的屏幕为基准，750rpx正好是屏幕的宽度。屏幕变宽，rpx实际显示效果会等比放大，但在App端和h5端，屏幕宽度达到960px时，默认将按照375px的屏幕宽度进行计算。拓展：在设置文件mainfest.json里开启px转rpx（默认关闭），所有的px可一键转换为rpx。uni-app在App端，H5端和小程序都支持rpx，并且可以配置不同屏幕宽度的计算方式。750 * 元素在设计稿中的宽度 / 设计稿基准宽度。rpx直接支持动态绑定。

前提背景自己项目里获取列表数据的接口，传入的参数包括：currentPageNo（当前页数），pageSize（每页显示的最大个数）以及其他查询数据所需要的参数；返回的需要用到的参数包括res.data.rows（列表数据），res.data.total（数据总数），res.data.totalPageCount （总页数）本质上是获取分页列表当然根据具体项目接口的要求，传入和返回的参数会有区别，以下记录的是app小程序中处理下拉加载的几种思路：第一种先判断获取数据的length是

const fsm = wx.getFileSystemManager();const FILE_BASE_NAME = 'tmp_base64src'; //自定义文件名function base64src(base64data, cb) { const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64data) || []; if (!format) { return (new Error('ERR

左上角的三角符号 onBackPress(event){ uni.redirectTo({ url:'../index/index' }); return true; },加在onLoad的同一级

修改文字uni.setNavigationBarTitle({ //这是修改后的导航栏文字 title: “首页”})修改文字颜色以及导航栏背景色uni.setNavigationBarColor({ frontColor: “#ffffff”, //文字颜色 backgroundColor: “#007AFF” //底部背景色})...

{ "path" : "", "style": { "navigationBarTitleText": "", "app-plus": { "titleNView": { "titleText": "", "titleSize": "36rpx",

注意toFixed()只能用在数值部分第一保留小数点数值后两位，尾数四舍五入numFilter (value) { // 截取当前数据到小数点后两位 let realVal = parseFloat(value).toFixed(2) return realVal}第二保留小数点后两位的，不会四舍五入numFilter (value) { // 截取当前数据到小数点后三位 let tempVal = parseFloat(value).toFixed(3) let realVal =

上传图片的方法uploadImg() { uni.chooseImage({ count: 1, //图片可选择数量 sizeType: ['original', 'compressed'], //original 原图，compressed 压缩图，默认二者都有 // sourceType: ['album'], //album 从相册选图，camera 使用相机，默认二者都有。 success: res => { let that = this; let fil

下载文件到设备并预览uni.downloadFile({ url: " "//文件地址 success: (data) => { if (data.statusCode === 200) { //文件保存到本地 uni.saveFile({ tempFilePath: data.tempFilePath, //临时路径 success: function(res) { uni.showToast({ icon: 'none', m

scroll-view 移动到最底部scroll-view 添加 :scroll-top = “scrollTop”data里设置 scrollTop:0, old:{scrollTop: 0}methods里添加方法：//移动到最底部moveToBottom() { this.scrollTop = this.old.scrollTop this.$nextTick(function() { //scrollTop设置一个超大值，移动到最底部 this.scrollTop = 9

跳转页面并转递参数跳转页面fromuni.navigateTo({ url: '/pages/views/notice/noticeDetailnoticeItem='+encodeURIComponent(JSON.stringify(e))});接收页面onLoad(option){ this.noticeItem = JSON.parse(decodeURIComponent(option.noticeItem)); },多个参数用&连接详情见：https://blo

进入App首先不进入登录页面manifest.json 源码配置"app-plus" : { "splashscreen" : { "alwaysShowBeforeRender" : false, "waiting" : true, "autoclose" : false, "delay" : 0 } }App.vue 文件 onLaunch 生命周期里面写法onLaunch: function() {

uni.setTabBarItem(OBJECT)动态设置 tabBar 某一项的内容uni.setTabBarItem({ index: 0, text: 'text', iconPath: '/path/to/iconPath', selectedIconPath: '/path/to/selectedIconPath'})uni.setTabBarStyle(OBJECT)动态设置 tabBar 的整体样式uni.setTabBarStyle({ color: '#F

取值function get(key,sync = true) { try { if(sync){ return uni.getStorageSync(key); }else{ let data = ''; uni.getStorage({ key:key, success: function (res) { data = res.data; } }); return data; } } catch (e) {

uni.navigateTo(OBJECT)保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack() 向后返回。uni.navigateTo({ url: 'test' });uni.redirectTo(OBJECT)关闭当前页面，跳转到应用内的某个页面。uni.redirectTo({ url: 'test?id=1'});uni.reLaunch(OBJECT)关闭所有页面，打开到应用内的某个页面。uni.reLaunch({ u

<view @touchmove="handletouchmove" @touchstart="handletouchstart" @touchend="handletouchend" > </view> handletouchstart(e) { this.timeOutEvent = setTimeout(() => { this.onLongPress(

//如果不是数字...if (!(/(^[1-9]\d*$)/.test(variable)){}//如果小数点后不是2位...if (!/^\d+(\.\d{1,2})?$/.test(variable)){}//如果不是电话号码...（能识别位数、开头是否符合）if (!(/^1[3456789]\d{9}$/.test(variable))){}...