Parcourir la source

opt:删除无用代码

Shu il y a 3 mois
Parent
commit
8d9c4e8de6
3 fichiers modifiés avec 0 ajouts et 144 suppressions
  1. 0 28
      components/roll-text/props.js
  2. 0 114
      components/roll-text/roll-text.vue
  3. 0 2
      pages/home/home.vue

+ 0 - 28
components/roll-text/props.js

@@ -1,28 +0,0 @@
-export default {
-    props: {
-        // 显示的内容,字符串
-        text: {
-            type: String,
-        },
-        // 文字颜色,各图标也会使用文字颜色
-        color: {
-            type: String,
-            default: "black"
-        },
-        // 背景颜色
-        bgColor: {
-            type: String,
-            default: "#ffffff"
-        },
-        // 字体大小,单位px
-        fontSize: {
-            type: [String, Number],
-            default: 14
-        },
-        // 水平滚动时的滚动速度,即每秒滚动多少px(rpx),这有利于控制文字无论多少时,都能有一个恒定的速度
-        speed: {
-            type: [String, Number],
-            default: 80
-        }
-    }
-}

+ 0 - 114
components/roll-text/roll-text.vue

@@ -1,114 +0,0 @@
-<template>
-   <view class="u-notice">
-    <view class="u-notice__content">
-        <view class="u-notice__content__text" ref="u-notice__content__text" :style="[animationStyle]">
-				<view
-					v-for="(item, index) in innerText"
-					:key="index"
-					:style="[textStyle]"
-				>{{item}}</view>
-			</view>
-    </view>
-   </view>
-</template>
-
-<script>
-import props from './props.js';
-    export default {
-        mixins: [props],
-        computed: {
-            animationStyle() {
-				let style = {}
-				style.animationDuration = this.animationDuration
-				style.animationPlayState = this.animationPlayState
-				return style
-			},
-            // 文字内容的样式
-			textStyle() {
-				let style = {}
-				style.color = this.color
-				style.fontSize = this.fontSize + "px"
-				return style
-			},
-            innerText() {
-				let result = [],
-					// 每组text标签的字符长度
-					len = 20
-				const textArr = this.text.split('')
-				for (let i = 0; i < textArr.length; i += len) {
-					// 对拆分的后的text进行slice分割,得到的为数组再进行join拼接为字符串
-					result.push(textArr.slice(i, i + len).join(''))
-				}
-				return result
-			}
-        },
-		mounted() {
-			// this.vue()
-		},
-		methods: {
-			async vue() {
-				let boxWidth = 0,
-					textWidth = 0
-				console.log("this", this);
-
-				// 进行一定的延时
-				await new Promise((resolve) => {
-					setTimeout(() => {
-						resolve()
-					}, 30)
-				})
-
-				// 查询盒子和文字的宽度
-				textWidth = (await this.$uGetRect('.u-notice__content__text')).width
-				boxWidth = (await this.$uGetRect('.u-notice__content')).width
-				console.log("textWidth", textWidth, "boxWidth", boxWidth);
-				// 根据t=s/v(时间=路程/速度),这里为何不需要加上#u-notice-box的宽度,因为中设置了.u-notice-content样式中设置了padding-left: 100%
-				// 恰巧计算出来的结果中已经包含了#u-notice-box的宽度
-				this.animationDuration = `${textWidth / this.speed}s`
-				console.log("this.$uGetRect('.u-notice__content__text')", await this.$uGetRect('.u-notice__content__text', true));
-				// 这里必须这样开始动画,否则在APP上动画速度不会改变
-				this.animationPlayState = 'paused'
-				setTimeout(() => {
-					this.animationPlayState = 'running'
-				}, 10)
-			}
-		}
-    }
-</script>
-
-<style lang="scss" scoped>
-.u-notice {
-		display: flex;
-		width: 460rpx;
-		align-items: center;
-
-		&__content {
-			text-align: right;
-			flex: 1;
-			display: flex;
-			flex-wrap: nowrap;
-			overflow: hidden;
-
-			&__text {
-				font-size: 14px;
-				padding-left: 100%;
-				word-break: keep-all;
-				white-space: nowrap;
-				animation: u-loop-animation 5s linear infinite both;
-				display: flex;
-                flex-direction: row;
-			}
-		}
-
-	}
-
-	@keyframes u-loop-animation {
-		0% {
-			transform: translate3d(-440rpx, 0, 0);
-		}
-
-		100% {
-			transform: translate3d(-60%, 0, 0);
-		}
-	}
-</style>

+ 0 - 2
pages/home/home.vue

@@ -198,8 +198,6 @@
 </script>
 
 <style lang="scss" scoped>
-	@import "../../config.scss";
-
 	.container {
 		height: 100%;
 		width: 100%;