1. 修复在nvue下样式的警告和报错问题

2. 修复grid组件在头条小程序的报错的问题 3. 优化tabs组件在头条小程序的表现问题 4. 修复index-list组件在头条小程序上的兼容性 5. 修复layout组件在头条小程序上的兼容性 6. 修复table组件在头条小程序上的兼容性 7. 修复checkbox组件在头条小程序上的兼容性 8. 修复radio组件在头条小程序上的兼容性 9. 修复form和form-item在头条小程序上的兼容性 10. 修复popup在头条小程序上底部有缺失的问题，同时连带修复使用了popup的keyborad和picker，calendar等组件的问题 11. 优化toast组件多次调用，可能会造成配置混乱的问题 12. 修复rate组件在微信，头条小程序上滑动选择可能不正确的问题 13. 优化line组件在头条小程序上的兼容性 14. 修复message-input组件在头条小程序上的兼容性 15. 优化link组件在头条小程序上复制链接后，toast弹出瞬间被关闭的问题 16. 优化empty演示在头条小程序上的兼容性 17. 优化tag组件在支付宝小程序上不支持行内样式加"!important"的问题
umicro · Sep 3, 2020 · 46a5308 · 46a5308
1 parent 92669cb
commit 46a5308
Show file tree

Hide file tree

Showing 17 changed files with 123 additions and 112 deletions.
diff --git a/manifest.json b/manifest.json
@@ -2,7 +2,7 @@
     "name" : "uView",
     "appid" : "__UNI__60F4B81",
     "description" : "多平台快速开发的UI框架",
-    "versionName" : "1.6.5",
+    "versionName" : "1.6.6",
     "versionCode" : "100",
     "transformPx" : false,
     "app-plus" : {

diff --git a/pages/componentsA/empty/index.vue b/pages/componentsA/empty/index.vue
@@ -17,58 +17,58 @@
 			<view class="u-config-item">
 				<view class="u-item-title">模式选择</view>
 				<u-table>
-					<u-tr>
-						<u-td>
+					<u-tr class="u-tr">
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('car')">购物车为空</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('page')">页面不存在</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('search')">没有搜索结果</u-button>
 						</u-td>
 					</u-tr>
-					<u-tr>
-						<u-td>
+					<u-tr class="u-tr">
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('address')">没有收货地址</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('wifi')">没有WiFi</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('order')">订单为空</u-button>
 						</u-td>
 					</u-tr>
-					<u-tr>
-						<u-td>
+					<u-tr class="u-tr">
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('coupon')">没有优惠券</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('favor')">没有收藏</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('permission')">无权限</u-button>
 						</u-td>
 					</u-tr>
-					<u-tr>
-						<u-td>
+					<u-tr class="u-tr">
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('history')">无历史记录</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('news')">无新闻列表</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('message')">消息列表为空</u-button>
 						</u-td>
 					</u-tr>
-					<u-tr>
-						<u-td>
+					<u-tr class="u-tr">
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('list')">列表为空</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							<u-button :hair-line="false" size="mini" @click="modeChange('data')">数据为空</u-button>
 						</u-td>
-						<u-td>
+						<u-td class="u-td">
 							待扩展
 						</u-td>
 					</u-tr>

diff --git a/pages/componentsA/modal/index.vue b/pages/componentsA/modal/index.vue
@@ -9,7 +9,7 @@
 					:show-title="showTitle" :async-close="asyncClose"
 					@confirm="confirm" :content="content"
 				>
-					<!-- #ifndef MP-WEIXIN -->
+					<!-- #ifndef MP-WEIXIN || MP-TOUTIAO -->
 					<view class="warp" style="margin: 30rpx;" v-if="contentSlot">
 						<image class="logo" src="https://uviewui.com/common/logo.png" style="width: 220rpx;" mode="widthFix"></image>
 					</view>

diff --git a/pages/componentsA/slider/index.vue b/pages/componentsA/slider/index.vue
@@ -11,7 +11,7 @@
 					@end="end"
 					@moving="moving"
 				>
-					<!-- #ifndef MP-WEIXIN -->
+					<!-- #ifndef MP-WEIXIN || MP-TOUTIAO -->
 					<view class="" v-if="useSlot">
 						<view class="badge-button">
 							{{value}}

diff --git a/pages/componentsB/line/index.vue b/pages/componentsB/line/index.vue
@@ -3,7 +3,8 @@
 		<view class="u-demo-wrap">
 			<view class="u-demo-title">演示效果</view>
 			<view class="u-demo-area u-flex u-row-center">
-				<u-line :border-style="borderStyle" color="red" :color="color" :length="length" :direction="direction" :hair-line="hairLine"></u-line>
+				<!-- 头条小程序因为兼容性，必须要给组件写上u-line类 -->
+				<u-line class="u-line" :border-style="borderStyle" color="red" :color="color" :length="length" :direction="direction" :hair-line="hairLine"></u-line>
 			</view>
 		</view>
 		<view class="u-config-wrap">

diff --git a/pages/componentsB/tabbar/index.vue b/pages/componentsB/tabbar/index.vue
@@ -28,7 +28,6 @@
 			</view>
 		</view>
 		<u-tabbar
-		    :beforeSwitch="beforeSwitch"
 		    v-model="current"
 		    :show="show"
 		    :bg-color="bgColor"

diff --git a/pages/componentsC/test/index.vue b/pages/componentsC/test/index.vue
@@ -1,52 +1,37 @@
 <template>
 	<view class="">
-		<u-dropdown ref="uDropdown" @open="open" @close="close">
-			<u-dropdown-item v-model="value1" title="距离" :options="options1" @change="change"></u-dropdown-item>
-			<u-dropdown-item v-model="value2" title="温度" :options="options2"></u-dropdown-item>
-		</u-dropdown>
+		<u-button @click="show = true;">打开弹窗</u-button>
+		<u-popup mode="bottom" v-model="show">
+			<view class="content">
+				<u-image class="image" width="500rpx" height="300rpx" src="https://cdn.uviewui.com/uview/example/fade.jpg"></u-image>
+
+				<view class="confrim-btn">
+					<u-button @click="show = false;">确定</u-button>
+				</view>
+			</view>
+		</u-popup>
 	</view>
 </template>
 
 <script>
 	export default {
 		data() {
 			return {
-				value1: 1,
-				value2: 2,
-				options1: [{
-						label: '默认排序',
-						value: 1,
-					},
-					{
-						label: '距离优先',
-						value: 2,
-					}
-				],
-				options2: [{
-						label: '去冰',
-						value: 1,
-					},
-					{
-						label: '加冰',
-						value: 2,
-					},
-				],
-			}
-		},
-		methods: {
-			open(index) {
-				// 展开某个下来菜单时，先关闭原来的其他菜单高亮
-				// 同时内部会自动给当前展开项进行高亮
-				this.$refs.uDropdown.highlight();
-			},
-			close(index) {
-				// 关闭的时候，给当前项加上高亮
-				// 当然，您也可以通过监听dropdown-item的@change事件进行处理
-				this.$refs.uDropdown.highlight(index);
-			},
-			change() {
-				// 更多的细节，请自行实现
+				show: true
 			}
 		}
 	}
-</script>
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		padding: 24rpx;
+		text-align: center;
+		position: relative;
+	}
+	
+	.image {
+		position: absolute;
+		top: -200rpx;
+	}
+</style>
diff --git a/pages/example/components.config.js b/pages/example/components.config.js
@@ -219,12 +219,16 @@ export default [{
 			icon: 'mask',
 			title: 'Mask 遮罩层',
 			title_en: 'Mask',
-		}, {
+		}, 
+		// #ifndef MP-TOUTIAO
+		{
 			path: '/pages/componentsA/noNetwork/index',
 			icon: 'noNetwork',
 			title: 'NoNetwork 无网络提示',
 			title_en: 'NoNetwork',
-		}, {
+		}, 
+		// #endif
+		{
 			path: '/pages/componentsC/grid/index',
 			icon: 'grid',
 			title: 'Grid 宫格布局',
@@ -250,12 +254,14 @@ export default [{
 			title: 'Sticky 吸顶',
 			title_en: 'Sticky',
 		}, 
+		// #ifndef MP-TOUTIAO
 		{
 			path: '/pages/componentsB/waterfall/index',
 			icon: 'waterfall',
 			title: 'Waterfall 瀑布流',
 			title_en: 'Waterfall',
 		},
+		// #endif
 		{
 			path: '/pages/componentsB/divider/index',
 			icon: 'divider',

diff --git a/uview-ui/components/u-link/u-link.vue b/uview-ui/components/u-link/u-link.vue
@@ -67,13 +67,13 @@
 				// #ifdef MP
 				uni.setClipboardData({
 					data: this.href,
-					success() {
+					success: () => {
 						uni.hideToast();
+						this.$nextTick(() => {
+							this.$u.toast(this.mpTips);
+						})
 					}
 				});
-				this.$nextTick(() => {
-					this.$u.toast(this.mpTips);
-				})
 				// #endif
 			}
 		}

diff --git a/uview-ui/components/u-message-input/u-message-input.vue b/uview-ui/components/u-message-input/u-message-input.vue
@@ -2,7 +2,8 @@
 	<view class="u-char-box">
 		<view class="u-char-flex">
 			<input :disabled="disabledKeyboard" :value="valueModel" type="number" :focus="focus" :maxlength="maxlength" class="u-input" @input="getVal"/>
-			<view v-for="(item, index) in maxlength" :key="index">
+			<!-- 这里需要通过new Array生成一个供循环的数组，是因为头条小程序不支持通过v-for历遍一个数值，其他端都是正常的 -->
+			<view v-for="(item, index) in (new Array(maxlength).fill(0))" :key="index">
 				<view :class="[breathe && charArrLength == index ? 'u-breathe' : '', 'u-char-item',
 				charArrLength === index && mode == 'box' ? 'u-box-active' : '',
 				mode === 'box' ? 'u-box' : '']" :style="{
@@ -118,13 +119,13 @@
 			}
 		},
 		watch: {
-			maxlength: {
-				// 此值设置为true，会在组件加载后无需maxlength变化就会执行一次本监听函数，无需再created生命周期中处理
-				immediate: true,
-				handler(val) {
-					this.maxlength = Number(val);
-				}
-			},
+			// maxlength: {
+			// 	// 此值设置为true，会在组件加载后无需maxlength变化就会执行一次本监听函数，无需再created生命周期中处理
+			// 	immediate: true,
+			// 	handler(val) {
+			// 		this.maxlength = Number(val);
+			// 	}
+			// }, 
 			value: {
 				immediate: true,
 				handler(val) {

diff --git a/uview-ui/components/u-popup/u-popup.vue b/uview-ui/components/u-popup/u-popup.vue
@@ -2,7 +2,7 @@
 	<view v-if="visibleSync" :style="[customStyle, {
 		zIndex: uZindex - 1
 	}]" class="u-drawer" hover-stop-propagation>
-		<u-mask :custom-style="maskCustomStyle" :maskClickAble="maskCloseAble" :z-index="uZindex - 2" :show="showDrawer && mask" @click="maskClick"></u-mask>
+		<u-mask :duration="duration" :custom-style="maskCustomStyle" :maskClickAble="maskCloseAble" :z-index="uZindex - 2" :show="showDrawer && mask" @click="maskClick"></u-mask>
 		<view
 			class="u-drawer-content"
 			@tap="modeCenterClose(mode)"
@@ -188,6 +188,11 @@ export default {
 			default() {
 				return {}
 			}
+		},
+		// 遮罩打开或收起的动画过渡时间，单位ms
+		duration: {
+			type: [String, Number],
+			default: 250
 		}
 	},
 	data() {
@@ -237,6 +242,7 @@ export default {
 				// 不加可能圆角无效
 				style.overflow = 'hidden';
 			}
+			if(this.duration) style.transition = `all ${this.duration / 1000}s linear`;
 			return style;
 		},
 		// 中部弹窗的特有样式
@@ -323,7 +329,7 @@ export default {
 				this.timer = setTimeout(() => {
 					this[param2] = status;
 					this.$emit(status ? 'open' : 'close');
-				}, 300);
+				}, this.duration);
 			}
 		}
 	}
@@ -351,7 +357,7 @@ export default {
 	/* #endif */
 	position: absolute;
 	z-index: 1003;
-	transition: all 0.3s linear;
+	transition: all 0.25s linear;
 }
 
 .u-drawer__scroll-view {

diff --git a/uview-ui/components/u-rate/u-rate.vue b/uview-ui/components/u-rate/u-rate.vue
@@ -123,14 +123,14 @@ export default {
 		// 获取评分组件盒子的布局信息
 		getElRectById() {
 			// uView封装的获取节点的方法，详见文档
-			this.$u.getRect('#' + this.elId).then(res => {
+			this.$uGetRect('#' + this.elId).then(res => {
 				this.starBoxLeft = res.left;
 			})
 		},
 		// 获取单个星星的尺寸
 		getElRectByClass() {
 			// uView封装的获取节点的方法，详见文档
-			this.$u.getRect('.' + this.elClass).then(res => {
+			this.$uGetRect('.' + this.elClass).then(res => {
 				this.starWidth = res.width;
 				// 把每个星星右边到组件盒子左边的距离放入数组中
 				for (let i = 0; i < this.count; i++) {
@@ -191,8 +191,10 @@ export default {
 		}
 	},
 	mounted() {
-		this.getElRectById();
-		this.getElRectByClass();
+		setTimeout(() => {
+			this.getElRectById();
+			this.getElRectByClass();
+		}, 100)
 	}
 };
 </script>

diff --git a/uview-ui/components/u-tag/u-tag.vue b/uview-ui/components/u-tag/u-tag.vue
@@ -112,9 +112,9 @@
 			customStyle() {
 				let style = {};
 				// 文字颜色（如果有此值，会覆盖type值的颜色）
-				if(this.color) style.color = this.color+"!important";
+				if(this.color) style.color = this.color;
 				// tag的背景颜色（如果有此值，会覆盖type值的颜色）
-				if(this.bgColor) style.backgroundColor = this.bgColor+"!important";
+				if(this.bgColor) style.backgroundColor = this.bgColor;
 				// 如果是镂空型tag，没有传递边框颜色（borderColor）的话，使用文字的颜色（color属性）
 				if(this.mode == 'plain' && this.color && !this.borderColor) style.borderColor = this.color;
 				else style.borderColor = this.borderColor;