修改滚动公告 data 声明及消息数据

examples/hello-uniapp/common/uni.css

@@ -874,7 +874,7 @@ radio-group label, checkbox-group label{
 .uni-steps .current .step-content{border-color:#00B26A;}
 .uni-steps .current .step-title{color:#00B26A;}
 
-/* uni-comment */
+/* comment */
 .uni-comment{padding:5rpx 0; display: flex; flex-grow:1; flex-direction: column;}
 .uni-comment-list{flex-wrap:nowrap; padding:10rpx 0; margin:10rpx 0; width:100%; display: flex;}
 .uni-comment-face{width:70upx; height:70upx; border-radius:100%; margin-right:20upx; flex-shrink:0; overflow:hidden;}
@@ -886,4 +886,11 @@ radio-group label, checkbox-group label{
 .uni-comment-date{line-height:38upx; flex-direction:row; justify-content:space-between; display:flex !important; flex-grow:1;}
 .uni-comment-date view{color:#666666; font-size:24upx; line-height:38upx;}
 .uni-comment-content{line-height:1.6em; font-size:28upx; padding:8rpx 0;}
-.uni-comment-replay-btn{background:#FFF; font-size:24upx; line-height:28upx; padding:5rpx 20upx; border-radius:30upx; color:#333 !important; margin:0 10upx;}
+.uni-comment-replay-btn{background:#FFF; font-size:24upx; line-height:28upx; padding:5rpx 20upx; border-radius:30upx; color:#333 !important; margin:0 10upx;}
\ No newline at end of file
+
+/* swiper msg */
+.uni-swiper-msg{width:100%; padding:12rpx 0; flex-wrap:nowrap; display:flex;}
+.uni-swiper-msg-icon{width:50upx; margin-right:20upx;}
+.uni-swiper-msg-icon image{width:100%; flex-shrink:0;}
+.uni-swiper-msg swiper{width:100%; height:50upx;}
+.uni-swiper-msg swiper-item{line-height:50upx;}
\ No newline at end of file

examples/hello-uniapp/pages/template/scrollmsg/scrollmsg.vue

@@ -10,14 +10,8 @@
 					<image src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png" mode="widthFix"></image>
 				</view>
 				<swiper vertical="true" autoplay="true" circular="true" interval="3000">
-					<swiper-item>
-						<navigator>内容......</navigator>
-					</swiper-item>
-					<swiper-item>
-						<navigator>内容......</navigator>
-					</swiper-item>
-					<swiper-item>
-						<navigator>内容......</navigator>
+					<swiper-item v-for="(item, index) in msg" :key="index">
+						<navigator>{{item}}</navigator>
 					</swiper-item>
 				</swiper>
 			</view>
@@ -30,14 +24,8 @@
 					<image src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png" mode="widthFix"></image>
 				</view>
 				<swiper autoplay="true" circular="true" interval="5000">
-					<swiper-item>
-						<navigator>内容......</navigator>
-					</swiper-item>
-					<swiper-item>
-						<navigator>内容......</navigator>
-					</swiper-item>
-					<swiper-item>
-						<navigator>内容......</navigator>
+					<swiper-item v-for="(item, index) in msg" :key="index">
+						<navigator>{{item}}</navigator>
 					</swiper-item>
 				</swiper>
 			</view>
@@ -45,16 +33,19 @@
 	</view>
 </template>
 <script>
-export default {
-	data:{
-		title:"滚动公告"
+export default {
+	data() {
+		return {
+			title:"滚动公告",
+			msg : [
+				'uni-app行业峰会频频亮相，开发者反响热烈',
+				'DCloud完成B2轮融资，uni-app震撼发布',
+				'36氪热文榜推荐、CSDN公号推荐 DCloud CEO文章'
+			]
+		}
 	}
 }
 </script>
 <style>
-.uni-swiper-msg{width:100%; padding:12rpx 0; flex-wrap:nowrap; display:flex;}
-.uni-swiper-msg-icon{width:50upx; margin-right:20upx;}
-.uni-swiper-msg-icon image{width:100%; flex-shrink:0;}
-.uni-swiper-msg swiper{width:100%; height:50upx;}
-.uni-swiper-msg swiper-item{line-height:50upx;}
+
 </style>