用了很多网上的方法都有用最后采取的方法是使用v-show进行状态判断,两个底部弹窗一个显示的时候另外一个进行隐藏。每次都只显示一个
uniapp-image标签显示层级始终最高问题: 当实现顶部的菜单栏固定后,下边的list列表需要上拉时,因为其显示层始终最高,所以覆盖tab栏。 解决办法使用view的background属性来加载图片(可以使用外部路径也可以使用本地图片),就可解决此类问题。
<view v-if="status"style="width: 90%; height: 2rpx; background-color: #bcbcbc; margin-left: 20rpx;"></view> <viewclass="pd12_10"v-if="status"> <viewclass="ft14">热门城市</view> <viewclass="flex wrap"> <viewclass="ft14 hot_city border"v-for="(item, index) in hot":key...
此时可以使用一个高度为 var(–status-bar-height) 的 view 放在页面顶部,同时需使用plus.navigator.getStatusbarHeight()来动态计算系统状态栏的高度barHeight,然后设置页面主view的样式:style="{'margin-top':barHeight+'px'}",来避免页面内容出现在状态栏。 <template> <view class="uni-flex uni-column" st...
第三步:编辑自定义组件 DialogMessage/index.vue <template name="dialogMessage"> <view class="mask" v-if="show"> <view class="content"> <view class="title">系统升级</view> <view class="hint">为了给您提供更好的体验系统已升级快去试试看吧!</view> <van-button class="jump-btn" @click=...
('cancel')">取消</view> </view> </view> </view> </view> </view> </template> export default { props: { modalTitle: { //标题 type: String, default: "" }, modalContent: { //内容 type: String, default: "" }, showIcon: { //关闭按钮 type: Boolean, default: true }, show...
</view> <view class="content"> <!-- 正文内容 --> </view> </view> </template> .slot-wrap { display: flex; align-items: center; /* 如果您想让slot内容占满整个导航栏的宽度 */ /* flex: 1; */ /* 如果您想让slot内容与导航栏左右有空隙 */ /* padding: 0 30rpx; */ } ...
<view class="nav_box"> 导航 </view> </view> </template> export default { data() { return { statusBarHeight:0 }; }, created() { console.log(uni.getSystemInfoSync()); this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight; } } ...
</view> // 进度条列表 gradeList: [], ast: ['s3', 's2', 's1'], showProgress: false, currentGrade: '' .s1 { position: absolute; bottom: 265rpx; color: #22d7bb; width: 85%; background: #ffffff; left: 7%; z-index: 10; ...
王爱号很肖