Merge branch 'nvue' into yiruiwen

components/page-nav/page-nav.vue

@@ -4,19 +4,21 @@
 			<image class="logo" src="https://cdn.uviewui.com/uview/common/logo.png" mode="widthFix"></image>
 			<view class="nav-info">
 				<view class="nav-title__text">
-					{{$t('common.title')}}
+					<!-- {{$t('common.title')}} -->
+					{{title}}
 				</view>
 				<view class="nav-slogan">
-					 {{$t('common.intro')}}
+					 <!-- {{$t('common.intro')}} -->
+					 {{desc}}
 				</view>
 			</view>
 		</view>
 		<view class="nav-desc">
 			{{desc}}
 		</view>
-		<view class="lang" @tap="switchLang">
+		<!-- <view class="lang" @tap="switchLang">
 			<u-icon size="46" color="warning" :name="lang"></u-icon>
-		</view>
+		</view> -->
 	</view>
 </template>
 
@@ -27,20 +29,20 @@
 			title: String,
 		},
 		computed: {
-			lang() {
-				return this.$i18n.locale == 'zh' ? 'zh' : 'en';
-			}
+			// lang() {
+			// 	return this.$i18n.locale == 'zh' ? 'zh' : 'en';
+			// }
 		},
 		methods: {
-			switchLang() {
-				this.$i18n.locale = this.$i18n.locale == 'en' ? 'zh' : 'en';
-				this.vuex_tabbar[0].text = this.$t('nav.components')
-				this.vuex_tabbar[1].text = this.$t('nav.js')
-				this.vuex_tabbar[2].text = this.$t('nav.template')
-				uni.setNavigationBarTitle({
-					title: this.$t(this.title)
-				});
-			}
+			// switchLang() {
+			// 	this.$i18n.locale = this.$i18n.locale == 'en' ? 'zh' : 'en';
+			// 	this.vuex_tabbar[0].text = this.$t('nav.components')
+			// 	this.vuex_tabbar[1].text = this.$t('nav.js')
+			// 	this.vuex_tabbar[2].text = this.$t('nav.template')
+			// 	uni.setNavigationBarTitle({
+			// 		title: this.$t(this.title)
+			// 	});
+			// }
 		}
 	}
 </script>
@@ -58,7 +60,10 @@
 	}
 	
 	.nav-title {
+		/* #ifndef APP-NVUE */
 		display: flex;
+		/* #endif */
+		flex-direction: row;
 		align-items: center;
 	}
 	
@@ -67,7 +72,9 @@
 	}
 	
 	.nav-title__text {
+		/* #ifndef APP-NVUE */
 		display: flex;
+		/* #endif */
 		color: $u-main-color;
 		font-size: 50rpx;
 		font-weight: bold;
@@ -75,8 +82,9 @@
 	
 	.logo {
 		width: 140rpx;
-		flex: 0 0 140rpx;
+		/* #ifndef APP-NVUE */
 		height: auto;
+		/* #endif */
 	}
 	
 	.nav-slogan {

pages/example/components.vue → pages/example/components.nvue

@@ -20,7 +20,7 @@
 		data() {
 			return {
 				list: list,
-				//desc: '众多组件覆盖开发过程的各个需求，组件功能丰富，多端兼容。让你快速集成，开箱即用。',
+				desc: '众多组件覆盖开发过程的各个需求，组件功能丰富，多端兼容。让你快速集成，开箱即用。',
 			}
 		},
 		computed: {
@@ -29,29 +29,31 @@
 					return 'https://cdn.uviewui.com/uview/example/' + path + '.png';
 				}
 			},
-			desc() {
-				return this.$t('components.desc');
-			}
+			// desc() {
+			// 	return this.$t('components.desc');
+			// }
 		},
 		onShow() {
-			uni.setNavigationBarTitle({
-				title: this.$t('nav.components')
-			});
+			// uni.setNavigationBarTitle({
+			// 	title: this.$t('nav.components')
+			// });
 		},
 		created() {
-			
+			//console.log(this.abc);   
 		},
 		methods: {
 			openPage(path) {
-				this.$u.route({
+				this.$u.route({ 
 					url: path
 				})
 			},
 			getGroupTitle(item) {
-				return this.$i18n.locale == 'zh' ? item.groupName : item.groupName_en
+				// return this.$i18n.locale == 'zh' ? item.groupName : item.groupName_en
+				return item.groupName;
 			},
 			getFieldTitle(item) {
-				return this.$i18n.locale == 'zh' ? item.title : item.title_en
+				// return this.$i18n.locale == 'zh' ? item.title : item.title_en
+				return item.title;
 			}
 		}
 	}
@@ -64,6 +66,7 @@
 </style>
 
 <style lang="scss" scoped>
+	
 	.u-cell-icon {
 		width: 36rpx;
 		height: 36rpx;

uview-ui/components/u-action-sheet/u-action-sheet.vue

@@ -163,7 +163,7 @@
 	}
 
 	.u-action-sheet-item {
-		display: flex;
+		@include vue-flex;;
 		line-height: 1;
 		justify-content: center;
 		align-items: center;

uview-ui/components/u-alert-tips/u-alert-tips.vue

@@ -166,7 +166,7 @@
 	@import "../../libs/css/style.components.scss";
 	
 	.u-alert-tips {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		padding: 16rpx 30rpx;
 		border-radius: 8rpx;

uview-ui/components/u-avatar-cropper/u-avatar-cropper.vue

@@ -252,7 +252,7 @@ export default {
 
 .cropper-wrapper {
 	position: relative;
-	display: flex;
+	@include vue-flex;
 	flex-direction: row;
 	justify-content: space-between;
 	align-items: center;
@@ -262,7 +262,7 @@ export default {
 
 .cropper-buttons {
 	width: 100vw;
-	display: flex;
+	@include vue-flex;
 	flex-direction: row;
 	justify-content: space-between;
 	align-items: center;

uview-ui/components/u-avatar/u-avatar.vue

@@ -200,7 +200,7 @@
 			width: 32rpx;
 			color: #ffffff;
 			height: 32rpx;
-			display: flex;
+			@include vue-flex;
 			justify-content: center;
 			align-items: center;
 			border-radius: 100rpx;
@@ -227,7 +227,7 @@
 			width: 32rpx;
 			color: #ffffff;
 			height: 32rpx;
-			display: flex;
+			@include vue-flex;
 			justify-content: center;
 			align-items: center;
 			border-radius: 100rpx;

uview-ui/components/u-back-top/u-back-top.vue

@@ -130,7 +130,7 @@
 		height: 80rpx;
 		position: fixed;
 		z-index: 9;
-		display: flex;
+		@include vue-flex;
 		flex-direction: column;
 		justify-content: center;
 		background-color: #E1E1E1;
@@ -139,7 +139,7 @@
 		transition: opacity 0.4s;
 		
 		&__content {
-			display: flex;
+			@include vue-flex;
 			flex-direction: column;
 			align-items: center;
 			

uview-ui/components/u-badge/u-badge.vue

@@ -141,7 +141,9 @@
 	@import "../../libs/css/style.components.scss";
 	
 	.u-badge {
+		/* #ifndef APP-NVUE */
 		display: inline-flex;
+		/* #endif */
 		justify-content: center;
 		align-items: center;
 		line-height: 24rpx;
@@ -207,7 +209,7 @@
 	// }
 	
 	.u-info {
-		background: $u-type-info;
+		background-color: $u-type-info;
 		color: #fff;
 	}
 </style>
\ No newline at end of file

uview-ui/components/u-button/u-button.vue

@@ -343,7 +343,7 @@ export default {
 	// 避免边框某些场景可能被“裁剪”，不能设置为hidden
 	overflow: visible;
 	line-height: 1;
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	justify-content: center;
 	cursor: pointer;

uview-ui/components/u-calendar/u-calendar.vue

@@ -502,7 +502,7 @@
 			&__text {
 				margin-top: 30rpx;
 				padding: 0 60rpx;
-				display: flex;
+				@include vue-flex;
 				justify-content: center;
 				align-items: center;
 			}
@@ -525,7 +525,7 @@
 		}
 	
 		&__week-day {
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 			justify-content: center;
 			padding: 6px 0;
@@ -539,7 +539,7 @@
 	
 		&__content {
 			width: 100%;
-			display: flex;
+			@include vue-flex;
 			flex-wrap: wrap;
 			padding: 6px 0;
 			box-sizing: border-box;
@@ -558,7 +558,7 @@
 			
 			&__item {
 				width: 14.2857%;
-				display: flex;
+				@include vue-flex;
 				align-items: center;
 				justify-content: center;
 				padding: 6px 0;
@@ -570,7 +570,7 @@
 					height: 84rpx;
 					display: -webkit-box;
 					display: -webkit-flex;
-					display: flex;
+					@include vue-flex;
 					align-items: center;
 					justify-content: center;
 					flex-direction: column;
@@ -619,7 +619,7 @@
 	
 		&__bottom {
 			width: 100%;
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 			justify-content: center;
 			flex-direction: column;

uview-ui/components/u-car-keyboard/u-car-keyboard.vue

 <template>
-	<view class="u-keyboard" @touchmove.stop.prevent>
+	<view class="u-keyboard" @touchmove.stop.prevent="() => {}">
 		<view class="u-keyboard-grids">
 			<block>
 				<view class="u-keyboard-grids-item" v-for="(group, i) in abc ? EngKeyBoardList : areaList" :key="i">
@@ -176,7 +176,7 @@
 	}
 
 	.u-keyboard-grids-item {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 	}
@@ -208,7 +208,7 @@
 		bottom: 32rpx;
 		height: 80rpx;
 		background-color: rgb(185, 188, 195);
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		border-radius: 8rpx;
 		justify-content: center;
@@ -225,7 +225,7 @@
 		bottom: 32rpx;
 		height: 80rpx;
 		background-color: #ffffff;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		border-radius: 8rpx;
 		justify-content: center;

uview-ui/components/u-cell-group/u-cell-group.vue

@@ -65,5 +65,6 @@
 
 	.u-cell-item-box {
 		background-color: #FFFFFF;
+		flex-direction: row;
 	}
 </style>

uview-ui/components/u-cell-item/u-cell-item.vue

@@ -211,9 +211,12 @@ export default {
 <style lang="scss" scoped>
 @import "../../libs/css/style.components.scss";
 .u-cell {
+	@include vue-flex;
+	align-items: center;
 	position: relative;
-	display: flex;
+	/* #ifndef APP-NVUE */
 	box-sizing: border-box;
+	/* #endif */
 	width: 100%;
 	padding: 26rpx 32rpx;
 	font-size: 28rpx;
@@ -240,21 +243,22 @@ export default {
 
 .u-cell__left-icon-wrap,
 .u-cell__right-icon-wrap {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	height: 48rpx;
 }
 
 .u-cell-border:after {
 	position: absolute;
+	/* #ifndef APP-NVUE */
 	box-sizing: border-box;
 	content: ' ';
 	pointer-events: none;
+	border-bottom: 1px solid $u-border-color;
+	/* #endif */
 	right: 0;
 	left: 0;
 	top: 0;
-	border-bottom: 1px solid $u-border-color;
-	-webkit-transform: scaleY(0.5);
 	transform: scaleY(0.5);
 }
 
@@ -267,13 +271,17 @@ export default {
 	font-size: 26rpx;
 	line-height: 36rpx;
 	color: $u-tips-color;
+	/* #ifndef APP-NVUE */
 	word-wrap: break-word;
+	/* #endif */
 }
 
 .u-cell__value {
 	overflow: hidden;
 	text-align: right;
+	/* #ifndef APP-NVUE */
 	vertical-align: middle;
+	/* #endif */
 	color: $u-tips-color;
 	font-size: 26rpx;
 }
@@ -284,14 +292,18 @@ export default {
 }
 
 .u-cell--required {
+	/* #ifndef APP-NVUE */
 	overflow: visible;
-	display: flex;
+	/* #endif */
+	@include vue-flex;
 	align-items: center;
 }
 
 .u-cell--required:before {
 	position: absolute;
+	/* #ifndef APP-PLUS */
 	content: '*';
+	/* #endif */
 	left: 8px;
 	margin-top: 4rpx;
 	font-size: 14px;

uview-ui/components/u-checkbox/u-checkbox.vue

@@ -223,7 +223,7 @@
 			color: $u-content-color;
 			flex: none;
 			display: -webkit-flex;
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 			justify-content: center;
 			box-sizing: border-box;

uview-ui/components/u-collapse-item/u-collapse-item.vue

@@ -166,7 +166,7 @@
 	
 	.u-collapse-head {
 		position: relative;
-		display: flex;
+		@include vue-flex;
 		justify-content: space-between;
 		align-items: center;
 		color: $u-main-color;

uview-ui/components/u-column-notice/u-column-notice.vue

@@ -193,7 +193,7 @@ export default {
 
 .u-notice-bar {
 	width: 100%;
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	justify-content: center;
 	flex-wrap: nowrap;
@@ -204,14 +204,14 @@ export default {
 .u-swiper {
 	font-size: 26rpx;
 	height: 32rpx;
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	flex: 1;
 	margin-left: 12rpx;
 }
 
 .u-swiper-item {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	overflow: hidden;
 }

uview-ui/components/u-count-down/u-count-down.vue

@@ -284,7 +284,7 @@ export default {
 	}
 
 	.u-countdown-item {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		padding: 2rpx;
@@ -300,7 +300,7 @@ export default {
 	}
 
 	.u-countdown-colon {
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 		padding: 0 5rpx;
 		line-height: 1;

uview-ui/components/u-divider/u-divider.vue

@@ -110,7 +110,7 @@ export default {
 	width: 100%;
 	position: relative;
 	text-align: center;
-	display: flex;
+	@include vue-flex;
 	justify-content: center;
 	align-items: center;
 	overflow: hidden;

uview-ui/components/u-dropdown-item/u-dropdown-item.vue

 <template>
-	<view class="u-dropdown-item" v-if="active" @touchmove.stop.prevent @tap.stop.prevent>
+	<view class="u-dropdown-item" v-if="active" @touchmove.stop.prevent="() => {}" @tap.stop.prevent="() => {}">
 		<view class="u-dropdown-item__options" v-if="!$slots.default">
 			<u-cell-group>
 				<u-cell-item @click="cellClick(item.value)" :arrow="false" :title="item.label" v-for="(item, index) in options" :key="index" :title-style="{

uview-ui/components/u-dropdown/u-dropdown.vue

@@ -181,14 +181,14 @@
 		width: 100%;
 
 		&__menu {
-			display: flex;
+			@include vue-flex;
 			position: relative;
 			z-index: 11;
 			height: 80rpx;
 
 			&__item {
 				flex: 1;
-				display: flex;
+				@include vue-flex;
 				justify-content: center;
 				align-items: center;
 
@@ -201,7 +201,7 @@
 					margin-left: 6rpx;
 					transition: transform .3s;
 					align-items: center;
-					display: flex;
+					@include vue-flex;
 					
 					&--rotate {
 						transform: rotate(180deg);

uview-ui/components/u-empty/u-empty.vue

@@ -173,7 +173,7 @@
 	@import "../../libs/css/style.components.scss";
 
 	.u-empty {
-		display: flex;
+		@include vue-flex;
 		flex-direction: column;
 		justify-content: center;
 		align-items: center;
@@ -185,7 +185,7 @@
 	}
 
 	.u-slot-wrap {
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 		align-items: center;
 		margin-top: 20rpx;

uview-ui/components/u-field/u-field.vue

@@ -292,7 +292,7 @@ export default {
 }
 
 .u-field-inner {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 }
 
@@ -307,7 +307,7 @@ export default {
 }
 
 .fild-body {
-	display: flex;
+	@include vue-flex;
 	flex: 1;
 	align-items: center;
 }
@@ -334,7 +334,7 @@ export default {
 	flex: 1 1 130rpx;
 	text-align: left;
 	position: relative;
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 }
 
@@ -358,7 +358,7 @@ export default {
 }
 
 .u-clear-icon {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 }
 

uview-ui/components/u-form-item/u-form-item.vue

@@ -319,7 +319,7 @@ export default {
 	@import "../../libs/css/style.components.scss";
 
 	.u-form-item {
-		display: flex;
+		@include vue-flex;
 		// align-items: flex-start;
 		padding: 20rpx 0;
 		font-size: 28rpx;
@@ -333,16 +333,16 @@ export default {
 		}
 
 		&__body {
-			display: flex;
+			@include vue-flex;
 		}
 
 		&--left {
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 
 			&__content {
 				position: relative;
-				display: flex;
+				@include vue-flex;
 				align-items: center;
 				padding-right: 10rpx;
 				flex: 1;
@@ -360,7 +360,7 @@ export default {
 				}
 
 				&__label {
-					display: flex;
+					@include vue-flex;
 					align-items: center;
 					flex: 1;
 				}
@@ -371,14 +371,14 @@ export default {
 			flex: 1;
 
 			&__content {
-				display: flex;
+				@include vue-flex;
 				align-items: center;
 				flex: 1;
 
 				&__slot {
 					flex: 1;
 					/* #ifndef MP */
-					display: flex;
+					@include vue-flex;
 					align-items: center;
 					/* #endif */
 				}

uview-ui/components/u-grid-item/u-grid-item.vue

@@ -74,7 +74,7 @@
 	.u-grid-item {
 		box-sizing: border-box;
 		background: #fff;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		position: relative;
@@ -102,7 +102,7 @@
 
 	.u-grid-item-box {
 		padding: 30rpx 0;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		flex-direction: column;

uview-ui/components/u-grid/u-grid.vue

@@ -87,7 +87,7 @@ export default {
 	/* #endif */
 	
 	/* #ifndef MP */
-	display: flex;
+	@include vue-flex;
 	flex-wrap: wrap;
 	align-items: center;
 	/* #endif */

uview-ui/components/u-icon/u-icon.vue

@@ -200,10 +200,16 @@ export default {
 
 <style scoped lang="scss">
 @import "../../libs/css/style.components.scss";
+/* #ifndef APP-NVUE */
+// 目前由于nvue对定义字体时的content属性报错，所以nvue先不引入
 @import '../../iconfont.css';
+/* #endif */
 
 .u-icon {
+	/* #ifndef APP-NVUE */
 	display: inline-flex;
+	/* #endif */
+	flex-direction: row;
 	align-items: center;
 
 	&--left {
@@ -251,8 +257,10 @@ export default {
 	}
 
 	&__img {
+		/* #ifndef APP-PLUS */
 		height: auto;
 		will-change: transform;
+		/* #endif */
 	}
 
 	&__label {

uview-ui/components/u-image/u-image.vue

@@ -251,7 +251,7 @@ export default {
 		left: 0;
 		width: 100%;
 		height: 100%;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		background-color: $u-bg-color;

uview-ui/components/u-index-list/u-index-list.vue

@@ -282,7 +282,7 @@
 		position: fixed;
 		top: 50%;
 		right: 0;
-		display: flex;
+		@include vue-flex;
 		flex-direction: column;
 		text-align: center;
 		transform: translateY(-50%);
@@ -308,7 +308,7 @@
 		font-size: 50rpx;
 		color: #fff;
 		background-color: rgba(0, 0, 0, 0.65);
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 		align-items: center;
 		padding: 0;

uview-ui/components/u-input/u-input.vue

@@ -317,10 +317,12 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@import "../../libs/css/style.components.scss";
+
 .u-input {
 	position: relative;
 	flex: 1;
-	display: flex;
+	@include vue-flex;
 
 	&__input {
 		//height: $u-form-item-height;

uview-ui/components/u-keyboard/u-keyboard.vue

@@ -179,7 +179,7 @@
 	}
 
 	.u-tooltip {
-		display: flex;
+		@include vue-flex;
 		justify-content: space-between;
 	}
 

uview-ui/components/u-line-progress/u-line-progress.vue

@@ -116,7 +116,7 @@
 		width: 0;
 		height: 100%;
 		align-items: center;
-		display: flex;
+		@include vue-flex;
 		justify-items: flex-end;
 		justify-content: space-around;
 		font-size: 20rpx;

uview-ui/components/u-loadmore/u-loadmore.vue

@@ -159,12 +159,12 @@
 	
 	.u-load-more-wrap {
 		width: 100%;
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 	}
 	
 	.u-load-more-inner {
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 		align-items: center;
 	}
@@ -172,7 +172,7 @@
 	.u-more {
 		width: 60%;
 		position: relative;
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 	}
 	
@@ -192,7 +192,7 @@
 	}
 	
 	.u-loadmore-icon {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 	}

uview-ui/components/u-mask/u-mask.vue

 <template>
-	<view class="u-mask" hover-stop-propagation :style="[maskStyle, zoomStyle]" @tap="click" @touchmove.stop.prevent :class="{
+	<view class="u-mask" hover-stop-propagation :style="[maskStyle, zoomStyle]" @tap="click" @touchmove.stop.prevent="() => {}" :class="{
 		'u-mask-zoom': zoom,
 		'u-mask-show': show
 	}">

uview-ui/components/u-message-input/u-message-input.vue

@@ -196,7 +196,7 @@
 	}
 
 	.u-char-flex {
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 		flex-wrap: wrap;
 		position: relative;
@@ -223,7 +223,7 @@
 		font-weight: bold;
 		color: $u-main-color;
 		line-height: 90rpx;
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 		align-items: center;
 	}

uview-ui/components/u-modal/u-modal.vue

@@ -266,7 +266,7 @@
 		}
 
 		&__footer {
-			display: flex;
+			@include vue-flex;
 
 			&__button {
 				flex: 1;

uview-ui/components/u-navbar/u-navbar.vue

@@ -252,14 +252,14 @@
 	}
 
 	.u-navbar-inner {
-		display: flex;
+		@include vue-flex;
 		justify-content: space-between;
 		position: relative;
 		align-items: center;
 	}
 
 	.u-back-wrap {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		flex: 1;
 		flex-grow: 0;
@@ -272,7 +272,7 @@
 	}
 
 	.u-navbar-content-title {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		flex: 1;
@@ -296,14 +296,14 @@
 
 	.u-navbar-right {
 		flex: 1;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: flex-end;
 	}
 
 	.u-slot-content {
 		flex: 1;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 	}
 </style>

uview-ui/components/u-no-network/u-no-network.vue

 <template>
-	<view class="u-no-network" v-if="!isConnected" :style="{'z-index': uZIndex}" @touchmove.stop.prevent="">
+	<view class="u-no-network" v-if="!isConnected" :style="{'z-index': uZIndex}" @touchmove.stop.prevent="() => {}">
 		<view class="u-inner">
 			<image class="u-error-icon" :src="image" mode="widthFix"></image>
 			<view class="u-tips">
@@ -190,7 +190,7 @@
 
 	.u-inner {
 		height: 100vh;
-		display: flex;
+		@include vue-flex;
 		flex-direction: column;
 		align-items: center;
 		justify-content: center;

uview-ui/components/u-notice-bar/u-notice-bar.vue

@@ -227,26 +227,26 @@ export default {
 }
 
 .u-direction-row {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	justify-content: space-between;
 }
 
 .u-left-icon {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 }
 
 .u-notice-box {
 	flex: 1;
-	display: flex;
+	@include vue-flex;
 	overflow: hidden;
 	margin-left: 12rpx;
 }
 
 .u-right-icon {
 	margin-left: 12rpx;
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 }
 

uview-ui/components/u-number-box/u-number-box.vue

@@ -315,7 +315,7 @@
 		text-align: center;
 		padding: 0;
 		margin: 0 6rpx;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 	}
@@ -323,7 +323,7 @@
 	.u-icon-plus,
 	.u-icon-minus {
 		width: 60rpx;
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 		align-items: center;
 	}

uview-ui/components/u-number-keyboard/u-number-keyboard.vue

 <template>
-	<view class="u-keyboard" @touchmove.stop.prevent>
+	<view class="u-keyboard" @touchmove.stop.prevent="() => {}">
 		<view class="u-keyboard-grids">
 			<view
 			    class="u-keyboard-grids-item"
@@ -128,7 +128,7 @@
 	}
 
 	.u-keyboard-grids {
-		display: flex;
+		@include vue-flex;
 		flex-wrap: wrap;
 	}
 
@@ -137,7 +137,7 @@
 		text-align: center;
 		font-size: 50rpx;
 		color: #333;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		height: 110rpx;

uview-ui/components/u-picker/u-picker.vue

@@ -610,7 +610,7 @@ export default {
 	width: 100%;
 	height: 90rpx;
 	padding: 0 40rpx;
-	display: flex;
+	@include vue-flex;
 	justify-content: space-between;
 	align-items: center;
 	box-sizing: border-box;
@@ -642,7 +642,7 @@ export default {
 }
 
 .u-column-item {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	justify-content: center;
 	font-size: 32rpx;

uview-ui/components/u-popup/u-popup.vue

@@ -388,10 +388,8 @@ export default {
 }
 
 .u-drawer-center {
-	/* #ifndef APP-NVUE */
-	display: flex;
+	@include vue-flex;
 	flex-direction: column;
-	/* #endif */
 	bottom: 0;
 	left: 0;
 	right: 0;

uview-ui/components/u-radio/u-radio.vue

@@ -176,7 +176,7 @@
 
 	.u-radio {
 		display: -webkit-flex;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		overflow: hidden;
 		user-select: none;
@@ -184,7 +184,7 @@
 		
 		&__icon-wrap {
 			color: $u-content-color;
-			display: flex;
+			@include vue-flex;
 			flex: none;
 			align-items: center;
 			justify-content: center;

uview-ui/components/u-read-more/u-read-more.vue

@@ -160,12 +160,12 @@
 			position: relative;
 			width: 100%;
 			padding-bottom: 26rpx;
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 			justify-content: center;
 
 			&__readmore-btn {
-				display: flex;
+				@include vue-flex;
 				align-items: center;
 				justify-content: center;
 				line-height: 1;

uview-ui/components/u-row-notice/u-row-notice.vue

@@ -217,7 +217,7 @@ export default {
 }
 
 .u-direction-row {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	justify-content: space-between;
 }
@@ -229,7 +229,7 @@ export default {
 
 .u-notice-box {
 	flex: 1;
-	display: flex;
+	@include vue-flex;
 	overflow: hidden;
 	margin-left: 12rpx;
 }
@@ -245,7 +245,7 @@ export default {
 	text-align: right;
 	// 这一句很重要，为了能让滚动左右连接起来
 	padding-left: 100%;
-	display: flex;
+	@include vue-flex;
 	flex-wrap: nowrap;
 }
 

uview-ui/components/u-row/u-row.vue

@@ -69,7 +69,7 @@
 	.u-row {
 		// 由于微信小程序编译后奇怪的页面结构，只能使用float布局实现，flex无法实现
 		/* #ifndef MP-WEIXIN || MP-QQ */
-		display: flex;
+		@include vue-flex;
 		/* #endif */
 		flex-wrap: wrap;
 	}

uview-ui/components/u-search/u-search.vue

@@ -287,20 +287,20 @@ export default {
 @import "../../libs/css/style.components.scss";
 
 .u-search {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	flex: 1;
 }
 
 .u-content {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	padding: 0 18rpx;
 	flex: 1;
 }
 
 .u-clear-icon {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 }
 
@@ -315,7 +315,7 @@ export default {
 .u-close-wrap {
 	width: 40rpx;
 	height: 100%;
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	justify-content: center;
 	border-radius: 50%;

uview-ui/components/u-section/u-section.vue

@@ -119,7 +119,7 @@
 	@import "../../libs/css/style.components.scss";
 	
 	.u-section {
-		display: flex;
+		@include vue-flex;
 		justify-content: space-between;
 		align-items: center;
 		width: 100%;
@@ -128,7 +128,7 @@
 			position: relative;
 			font-size: 28rpx;
 			padding-left: 20rpx;
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 			
 			&__icon-wrap {
@@ -143,7 +143,7 @@
 		&__right-info {
 			color: $u-tips-color;
 			font-size: 26rpx;
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 			
 			&__icon-arrow {

uview-ui/components/u-select/u-select.vue

@@ -386,7 +386,7 @@ export default {
 	}
 
 	&__header {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: space-between;
 		height: 80rpx;
@@ -404,7 +404,7 @@ export default {
 			box-sizing: border-box;
 
 			&__item {
-				display: flex;
+				@include vue-flex;
 				align-items: center;
 				justify-content: center;
 				font-size: 32rpx;

uview-ui/components/u-steps/u-steps.vue

@@ -114,7 +114,7 @@ $u-steps-item-number-width: 44rpx;
 $u-steps-item-dot-width: 20rpx;
 
 .u-steps {
-	display: flex;
+	@include vue-flex;
 	
 	.u-steps__item {
 		flex: 1;
@@ -123,13 +123,13 @@ $u-steps-item-dot-width: 20rpx;
 		min-width: 100rpx;
 		font-size: 26rpx;
 		color: #8799a3;
-		display: flex;
+		@include vue-flex;
 		justify-content: center;
 		flex-direction: column;
 		align-items: center;
 		
 		&--row {
-			display: flex;
+			@include vue-flex;
 			flex-direction: column;
 			
 			.u-steps__item__line {
@@ -149,7 +149,7 @@ $u-steps-item-dot-width: 20rpx;
 		}
 		
 		&--column {
-			display: flex;
+			@include vue-flex;
 			flex-direction: row;
 			justify-content: flex-start;
 			min-height: 120rpx;
@@ -171,7 +171,7 @@ $u-steps-item-dot-width: 20rpx;
 		}
 		
 		&__num {
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 			justify-content: center;
 			width: $u-steps-item-number-width;
@@ -184,7 +184,7 @@ $u-steps-item-dot-width: 20rpx;
 		&__dot {
 			width: $u-steps-item-dot-width;
 			height: $u-steps-item-dot-width;
-			display: flex;
+			@include vue-flex;
 			border-radius: 50%;
 		}
 		

uview-ui/components/u-subsection/u-subsection.vue

@@ -306,7 +306,7 @@
 	@import "../../libs/css/style.components.scss";
 	
 	.u-subsection {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		overflow: hidden;
 		position: relative;
@@ -317,7 +317,7 @@
 		text-align: center;
 		font-size: 26rpx;
 		height: 100%;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		color: $u-main-color;
@@ -348,7 +348,7 @@
 	.u-item-text {
 		transition: all 0.35s;
 		color: $u-main-color;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		position: relative;
 		z-index: 3;

uview-ui/components/u-swipe-action/u-swipe-action.vue

@@ -230,7 +230,7 @@ export default {
 }
 
 .u-swipe-view {
-	display: flex;
+	@include vue-flex;
 	height: initial;
 	position: relative;
 	/* 这一句很关键，覆盖默认的绝对定位 */

uview-ui/components/u-swiper/u-swiper.vue

@@ -252,7 +252,7 @@
 	.u-swiper-indicator {
 		padding: 0 24rpx;
 		position: absolute;
-		display: flex;
+		@include vue-flex;
 		width: 100%;
 		z-index: 1;
 	}
@@ -331,7 +331,7 @@
 	}
 
 	.u-swiper-item {
-		display: flex;
+		@include vue-flex;
 		overflow: hidden;
 		align-items: center;
 	}

uview-ui/components/u-switch/u-switch.vue

@@ -123,7 +123,7 @@
 	}
 
 	.u-switch__node {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		position: absolute;
@@ -142,7 +142,7 @@
 	}
 
 	.u-switch__loading {
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 	}

uview-ui/components/u-tabbar/u-tabbar.vue

 <template>
-	<view v-if="show" class="u-tabbar" @touchmove.stop.prevent>
+	<view v-if="show" class="u-tabbar" @touchmove.stop.prevent="() => {}">
 		<view class="u-tabbar__content safe-area-inset-bottom" :style="{
 			height: $u.addUnit(height),
 			backgroundColor: bgColor,
@@ -230,14 +230,17 @@
 </script>
 
 <style scoped lang="scss">
+	@import "../../libs/css/style.components.scss";
 	.u-fixed-placeholder {
+		/* #ifndef APP-NVUE */
 		box-sizing: content-box;
+		/* #endif */
 	}
 
 	.u-tabbar {
 
 		&__content {
-			display: flex;
+			@include vue-flex;
 			align-items: center;
 			position: relative;
 			position: fixed;
@@ -245,7 +248,9 @@
 			left: 0;
 			width: 100%;
 			z-index: 998;
+			/* #ifndef APP-NVUE */
 			box-sizing: content-box;
+			/* #endif */
 
 			&__circle__border {
 				border-radius: 100%;
@@ -270,14 +275,14 @@
 				justify-content: center;
 				height: 100%;
 				padding: 12rpx 0;
-				display: flex;
+				@include vue-flex;
 				flex-direction: column;
 				align-items: center;
 				position: relative;
 
 				&__button {
 					position: absolute;
-					top: 10rpx;
+					top: 14rpx;
 					left: 50%;
 					transform: translateX(-50%);
 				}
@@ -287,7 +292,7 @@
 					font-size: 26rpx;
 					line-height: 28rpx;
 					position: absolute;
-					bottom: 12rpx;
+					bottom: 14rpx;
 					left: 50%;
 					transform: translateX(-50%);
 				}
@@ -295,17 +300,19 @@
 
 			&__circle {
 				position: relative;
-				display: flex;
+				@include vue-flex;
 				flex-direction: column;
 				justify-content: space-between;
 				z-index: 10;
+				/* #ifndef APP-NVUE */
 				height: calc(100% - 1px);
+				/* #endif */
 
 				&__button {
 					width: 90rpx;
 					height: 90rpx;
 					border-radius: 100%;
-					display: flex;
+					@include vue-flex;
 					justify-content: center;
 					align-items: center;
 					position: absolute;

uview-ui/components/u-tabs-swiper/u-tabs-swiper.vue

@@ -414,7 +414,7 @@
 	}
 
 	.u-tabs-scorll-flex {
-		display: flex;
+		@include vue-flex;
 		justify-content: space-between;
 	}
 
@@ -454,7 +454,7 @@
 		position: absolute;
 		top: 0;
 		transition-property: left, background-color;
-		display: flex;
+		@include vue-flex;
 		flex-direction: row;
 		justify-content: center;
 		align-items: center;

uview-ui/components/u-tabs/u-tabs.vue

@@ -344,7 +344,7 @@
 	}
 
 	.u-tabs-scorll-flex {
-		display: flex;
+		@include vue-flex;
 		justify-content: space-between;
 	}
 </style>

uview-ui/components/u-td/u-td.vue

@@ -42,7 +42,7 @@
 	@import "../../libs/css/style.components.scss";
 	
 	.u-td {
-		display: flex;
+		@include vue-flex;
 		flex-direction: column;
 		flex: 1;
 		justify-content: center;

uview-ui/components/u-th/u-th.vue

@@ -41,7 +41,7 @@
 	@import "../../libs/css/style.components.scss";
 	
 	.u-th {
-		display: flex;
+		@include vue-flex;
 		flex-direction: column;
 		flex: 1;
 		justify-content: center;

uview-ui/components/u-time-line-item/u-time-line-item.vue

@@ -54,7 +54,7 @@
 	@import "../../libs/css/style.components.scss";
 	
 	.u-time-axis-item {
-		display: flex;
+		@include vue-flex;
 		flex-direction: column;
 		width: 100%;
 		position: relative;
@@ -67,7 +67,7 @@
 		left: -40rpx;
 		transform-origin: 0;
 		transform: translateX(-50%);
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		z-index: 1;

uview-ui/components/u-toast/u-toast.vue

@@ -141,7 +141,7 @@
 		border-radius: 8rpx;
 		background: #585858;
 		height: 80rpx;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		font-size: 28rpx;
@@ -162,7 +162,7 @@
 
 	.u-icon {
 		margin-right: 10rpx;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		line-height: normal;
 	}

uview-ui/components/u-top-tips/u-top-tips.vue

@@ -84,7 +84,7 @@
 		font-size: 28rpx;
 		left: 0;
 		right: 0;
-		display: flex;
+		@include vue-flex;
 		align-items: center;
 		justify-content: center;
 		opacity: 0;

uview-ui/components/u-tr/u-tr.vue

@@ -20,6 +20,6 @@
 	@import "../../libs/css/style.components.scss";
 	
 	.u-tr {
-		display: flex;
+		@include vue-flex;
 	}
 </style>

uview-ui/components/u-upload/u-upload.vue

@@ -525,7 +525,7 @@ export default {
 @import '../../libs/css/style.components.scss';
 
 .u-upload {
-	display: flex;
+	@include vue-flex;
 	flex-wrap: wrap;
 	align-items: center;
 }
@@ -578,13 +578,13 @@ export default {
 	border-radius: 100rpx;
 	width: 44rpx;
 	height: 44rpx;
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	justify-content: center;
 }
 
 .u-icon {
-	display: flex;
+	@include vue-flex;
 	align-items: center;
 	justify-content: center;
 }

uview-ui/components/u-waterfall/u-waterfall.vue

@@ -163,13 +163,13 @@ export default {
 @import "../../libs/css/style.components.scss";
 
 .u-waterfall {
-	display: flex;
+	@include vue-flex;
 	flex-direction: row;
 	align-items: flex-start;
 }
 
 .u-column {
-	display: flex;
+	@include vue-flex;
 	flex: 1;
 	flex-direction: column;
 	height: auto;

uview-ui/index.js

@@ -113,7 +113,7 @@ const $u = {
 }
 
 const install = Vue => {
-	Vue.mixin(mixin)
+	Vue.mixin(mixin) 
 	if (Vue.prototype.openShare) {
 		Vue.mixin(mpShare);
 	}

uview-ui/libs/css/common.scss

@@ -45,7 +45,7 @@ text {
 	/* #ifndef APP-NVUE */
 	display: flex;
 	/* #endif */
-	flex-direction: row;
+	flex-direction: row!important;
 	align-items: center;
 }
 
@@ -169,4 +169,8 @@ text {
 	}
 }
 
-
+// 重置nvue的默认关于flex的样式
+.u-reset-nvue {
+	flex-direction: row;
+	align-items: center;
+}
\ No newline at end of file

uview-ui/libs/css/style.components.scss

-.demo {
-	
+// 定义混入指令，用于在非nvue环境下的flex定义，因为nvue没有display属性，会报错
+@mixin vue-flex($direction: row) {
+	/* #ifndef APP-NVUE */
+	display: flex;
+	flex-direction: $direction;
+	/* #endif */
 }
\ No newline at end of file

vue.config.js

@@ -6,5 +6,5 @@ module.exports = {
 			disableHostCheck: true
 		}
 	},
-	//productionSourceMap: false
+	//productionSourceMap: false,
 }