uniapp填过的坑

最近公司一个项目要求使用uniapp写小程序，写的过程中遇到的一些坑点记录一下，方便之后查阅

快捷选中文档中相同字段

ctrl E

动态绑定style与函数calc的使用

:style="[{ height: 'calc(100vh - ' + statusBarHeight + 'rpx - 188rpx - env(safe-area-inset-bottom))'}, 
{top:'calc(' + statusBarHeight + 'rpx + 88rpx)' }]"

tip: 这里的 ‘-’ 两边必须加空格

修改uView 的 u-swiper 指示器默认样式 （scss）

tip: 由于没有找到官网的指示器大小与颜色的配置，只能强行改了

<template>
	<view class="city-home-page">
		<!-- banner图  -->
		<view class="banner-wrap">
			<u-swiper circular indicator-pos="bottomCenter" height="376" :list="list"></u-swiper>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
						title: '昨夜星辰昨夜风，画楼西畔桂堂东'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
						title: '身无彩凤双飞翼，心有灵犀一点通'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
						title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
					}
				]
			};
		},
		onLoad:function(val){
			console.log("val++++++",val)
			uni.setNavigationBarTitle({
			    title: '魅力河南'
			});
		}
	}
</script>

<style lang="scss" scoped>
	/* 修改指示器样式 */
	::v-deep .u-swiper-indicator {
		align-items: baseline;
	}

	::v-deep .u-indicator-item-round {
		background-color: #bbbbbb !important;
		width: 12rpx !important;
		height: 12rpx !important;
	}

	::v-deep .u-indicator-item-round-active {
		background-color: #4d8bff !important;
		width: 12rpx !important;
		height: 12rpx !important;
	}	

</style>

引用vant UI 库 app 报错

解决方法：

参考文档：https://my.oschina.net/u/3717831/blog/5126292

待新增…………