uni-app 185iOS端兼容处理
Posted 2019ab
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了uni-app 185iOS端兼容处理相关的知识，希望对你有一定的参考价值。
朋友圈样式问题
/pages.json
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
"path" : "pages/common/login/login",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path": "pages/tabbar/index/index",
"style":
"navigationBarTitleText": "uni-app",
"disableScroll": true // 不嵌套 scroller
,
"path" : "pages/tabbar/find/find",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/tabbar/my/my",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/tabbar/mail/mail",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/chat/chat/chat",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/chat/video/video",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/chat/chat-set/chat-set",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/user-base/user-base",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/user-tag-set/user-tag-set",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/user-remark-tag/user-remark-tag",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/user-moments-auth/user-moments-auth",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/send-card/send-card",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/user-report/user-report",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/find/moments/moments",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": true,
"app-plus":
"pullToRefresh":
"support":true,
"style":"circle"
,
"path" : "pages/my/userinfo/userinfo",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/my/code/code",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/my/fava/fava",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": true
,
"path" : "pages/common/search/search",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/find/add-moment/add-moment",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/my/setting/setting",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/add-friend/add-friend",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/apply-list/apply-list",
"style" :
"enablePullDownRefresh": true
,
"path" : "pages/mail/mail/mail",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/group-list/group-list",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/chat/group-remark/group-remark",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/chat/chat-list/chat-list",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/chat/chat-history/chat-history",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/chat/group-user/group-user",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
,
"path" : "pages/mail/tag-list/tag-list",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": true
,
"path" : "pages/mail/tag-read/tag-read",
"style" :
"navigationBarTitleText": "",
"enablePullDownRefresh": false
],
"globalStyle":
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
,
"globalStyle":
"navigationBarTextStyle":"black",
"navigationBarTitleText":"微信",
"navigationBarBackgroundColor":"#F8F8F8",
"backgroundColor":"#F8F8F8",
"app-plus":
"titleNView":false,
"scrollIndicator":"none"
,
"tabBar":
"borderStyle":"black",
"backgroundColor":"#F7F7F7",
"color":"#000000",
"selectedColor":"#08C261",
"list":[
"iconPath":"./static/tabbar/index.png",
"selectedIconPath":"./static/tabbar/index-select.png",
"pagePath":"pages/tabbar/index/index",
"text":"首页"
,
"iconPath":"./static/tabbar/mail.png",
"selectedIconPath":"./static/tabbar/mail-select.png",
"pagePath":"pages/tabbar/mail/mail",
"text":"通讯录"
,
"iconPath":"./static/tabbar/find.png",
"selectedIconPath":"./static/tabbar/find-select.png",
"pagePath":"pages/tabbar/find/find",
"text":"发现"
,
"iconPath":"./static/tabbar/my.png",
"selectedIconPath":"./static/tabbar/my-select.png",
"pagePath":"pages/tabbar/my/my",
"text":"我的"
]
,
"dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize",
"condition" : //模式配置，仅开发期间生效
"current": 0, //当前激活的模式(list 的索引项)
"list": [
"name": "", //模式名称
"path": "", //启动页面，必选
"query": "" //启动参数，在页面的onLoad函数里面得到
]
弹出层问题
/components/free-ui/free-popup.vue
<template>
<div style="z-index:9999;overflow:hidden;" v-if="status">
<!-- 蒙版 -->
<view v-if="mask" class="position-fixed top-0 left-0 right-0 bottom-0 z-index" :style="getMaskColor" @click="hide"></view>
<!-- 弹出框内容 -->
<div ref="popup" class="position-fixed free-animated z-index" :class="getBodyClass" :style="getBodyStyle">
<slot></slot>
</div>
</div>
</template>
<script>
// #ifdef APP-PLUS-NVUE
const animation = weex.requireModule('animation')
// #endif
export default
props:
// 是否开启蒙版颜色
maskColor:
type: Boolean,
default: false
,
// 是否开启蒙版
mask:
type:Boolean,
default:true
,
// 是否居中
center:
type:Boolean,
default:false
,
// 是否处于底部
bottom:
type:Boolean,
default:false
,
// 弹出层内容宽度
bodyWidth:
type:Number,
default:0
,
// 弹出层内容高度
bodyHeight:
type:Number,
default:0
,
bodyBgColor:
type:String,
default:"bg-white"
,
transformOrigin:
type:String,
default:"left top"
,
// tabbar高度
tabbarHeight:
type:Number,
default:0
,
data()
return
status: false,
x:-1,
y:1,
maxX:0,
maxY:0
,
mounted()
try
const res = uni.getSystemInfoSync();
this.maxX = res.windowWidth - uni.upx2px(this.bodyWidth)
this.maxY = res.windowHeight - uni.upx2px(this.bodyHeight) - uni.upx2px(this.tabbarHeight)
catch (e)
// error
,
computed:
getMaskColor()
let i = this.maskColor ? 0.5 : 0
return `background-color: rgba(0,0,0,$i);`
,
getBodyClass()
if(this.center)
return 'left-0 right-0 bottom-0 top-0 flex align-center justify-center'
let bottom = this.bottom ? 'left-0 right-0 bottom-0' : 'rounded border'
return `$this.bodyBgColor $bottom`
,
getBodyStyle()
let left = this.x > -1 ? `left:$this.xpx;` : ''
let top = this.y > -1 ? `top:$this.ypx;` : ''
return left + top
,
methods:
show(x = -1 ,y = -1)
if (this.status)
return;
this.x = (x > this.maxX) ? this.maxX : x
this.y = (y > this.maxY) ? this.maxY : y
this.status = true
// #ifdef APP-PLUS-NVUE
// this.$nextTick(()=>
// animation.transition(this.$refs.popup,
// styles:
// transform: 'scale(1,1)',
// transformOrigin:this.transformOrigin,
// opacity:1
// ,
// duration: 100, //ms
// timingFunction: 'ease',
// , function ()
// console.log('动画执行结束');
// )
// )
// #endif
,
hide()
this.$emit('hide')
// #ifdef APP-PLUS-NVUE
// animation.transition(this.$refs.popup,
// styles:
// transform: 'scale(0,0)',
// transformOrigin:this.transformOrigin,
// opacity:0
// ,
// duration: 100, //ms
// timingFunction: 'ease',
// , ()=>
// this.status = false
// console.log('动画执行结束');
// )
// #endif
this.status = false
</script>
<style scoped>
.free-animated
/* #ifdef APP-PLUS-NVUE */
/* transform: scale(0,0);
opacity: 0; */
/* #endif */
.z-index
/* #ifndef APP-NVUE */
z-index: 9999;
/* #endif */
</style>
底部聊天框问题
/pages/chat/chat/chat.nvue
<template>
<view>
<!-- 导航栏 -->
<free-nav-bar :title="detail.name" :noreadnum="totalNoreadnum" showBack>
<free-icon-button slot="right" @click="openChatSet"uni-app 174app端兼容处理