devbox
Cpp五条
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

时间轴播放插件_vue 时间轴播放插件

作者：Cpp五条 | 2024-02-22 12:58:58

赞

踩

vue 时间轴播放插件

time-slider/index.vue

  1. <template>
  2. 	<div class="sutpc-play-slider">
  3. 		<div class="play-wrap">
  4. 			<icon-svg
  5. 				name="play"
  6. 				@click.native="play"
  7. 				v-if="!isPlaying"
  8. 			/>
  9. 			<icon-svg
  10. 				name="pause"
  11. 				@click.native="pause"
  12. 				v-else
  13. 			/>
  14. 			<img
  15. 				class="hidden"
  16. 				src="./svgs/play.svg"
  17. 			/>
  18. 			<img
  19. 				class="hidden"
  20. 				src="./svgs/pause.svg"
  21. 			/>
  22. 			<div class="slider-wrap">
  23. 				<time-slider
  24. 					ref="slider"
  25. 					:interFilter="interFilter"
  26. 					:interFormat="interFormat"
  27. 					:tooltipFormat="tooltipFormat"
  28. 					v-model="currentValue"
  29. 					@move="sliderMoveHandler"
  30. 					:sliderData="sliderData"
  31. 				></time-slider>
  32. 			</div>
  33. 		</div>
  34. 	</div>
  35. </template>
  36.  
  37. <script>
  38.  
  39. 	import TimeSlider from "./components/slider";
  40.  
  41. 	export default {
  42. 		props: {
  43.             //时间间隔为5分钟
  44. 			timePrecision: {
  45. 				type: Number,
  46. 				default: 5
  47. 			},
  48. 			playData: {
  49. 				type: Array,
  50. 				default: function () {
  51. 					return [];
  52. 				}
  53. 			},
  54. 			value: {
  55. 				type: Number,
  56. 				default: 0
  57. 			},
  58. 			sliderData: {
  59. 				type: Array,
  60. 				default: function () {
  61. 					return [];
  62. 				}
  63. 			},
  64. 			playInterval: {
  65. 				type: Number,
  66. 				default: 2000
  67. 			}
  68. 		},
  69. 		components: {
  70. 			TimeSlider
  71. 		},
  72. 		data() {
  73. 			return {
  74. 				currentValue: this.value,
  75. 				isPlaying: false,
  76. 				currentPlayIndex: 0,
  77. 				initValue: this.value
  78. 			}
  79. 		},
  80. 		watch: {
  81. 			value: {
  82. 				handler() {
  83.  
  84. 					if (this.currentValue != this.value) {
  85. 						this.initValue = this.value;
  86. 					}
  87.  
  88. 					this.currentValue = this.value;
  89.  
  90. 					let currentPlayIndex = this.enabledSliderIndexArray.indexOf(this.currentValue);
  91. 					// 添加判断,初始化时enabledSliderIndexArray为空，currentPlayIndex为-1
  92. 					this.currentPlayIndex = currentPlayIndex == -1 ? 0 : currentPlayIndex;
  93. 				},
  94. 				immediate: true
  95. 			},
  96. 			currentValue() {
  97. 				this.$emit("input", this.currentValue);
  98. 			}
  99. 		},
  100. 		computed: {
  101. 			enabledSliderIndexArray() {
  102. 				let indexArray = [];
  103. 				this.sliderData.forEach(item => {
  104. 					if (item.type == 'disabled') {
  105. 						return;
  106. 					}
  107. 					for (let i = item.from; i <= item.to; i++) {
  108. 						indexArray.push(i);
  109. 					}
  110. 				});
  111. 				return indexArray;
  112. 			},
  113. 			currentTime() {
  114. 				let showValue = this.currentValue;
  115. 				if (this.dataFormat) {
  116. 					showValue = this.dataFormat(showValue,
  117. 						this.$refs.slider &&
  118. 						this.$refs.slider.getValueType &&
  119. 						this.$refs.slider.getValueType(showValue));
  120. 				}
  121. 				return `${showValue}`;
  122. 			},
  123. 			interFilter: ({ timePrecision }) => Object.seal(value => (value % ((60 / timePrecision) * 2) === 0 || value === 1)),
  124. 			interFormat: ({ timePrecision }) => Object.seal(value => {
  125. 				if ((value % ((60 / timePrecision) * 4) === 0)) {
  126. 					return `${Math.floor(value / (60 / timePrecision)).toString().padStart(2, '0')}:${(value % (60 / timePrecision) * timePrecision).toString().padStart(2, '0')}`;
  127. 				}
  128. 				return ''
  129. 			}),
  130. 			tooltipFormat: ({ timePrecision }) => Object.seal(value => `${Math.floor(value / (60 / timePrecision)).toString().padStart(2, '0')}:${(value % (60 / timePrecision) * timePrecision).toString().padStart(2, '0')}`),
  131. 			dataFormat: ({ timePrecision }) => Object.seal(value => `${Math.floor(value / (60 / timePrecision)).toString().padStart(2, '0')}:${(value % (60 / timePrecision) * timePrecision).toString().padStart(2, '0')}`),
  132. 		},
  133. 		methods: {
  134. 			sliderMoveHandler() {
  135. 				this.currentPlayIndex = this.enabledSliderIndexArray.indexOf(this.currentValue);
  136. 				if (this.isPlaying) {
  137. 					clearInterval(this.playInter);
  138. 					this.play();
  139. 				}
  140. 			},
  141. 			play() {
  142. 				// 判断是否第一次播放并且是播放进度的最后一个时刻
  143. 				// 如果是则currentPlayIndex=0，直接从头播放
  144. 				if (this.isFirstTime == undefined && this.currentPlayIndex == this.enabledSliderIndexArray.length - 1) {
  145. 					this.currentPlayIndex = 0;
  146. 					this.isFirstTime = false;
  147. 				}
  148.  
  149. 				this.isPlaying = true;
  150. 				this.currentValue = this.enabledSliderIndexArray[this.currentPlayIndex];
  151. 				this.playInter = setInterval(() => {
  152. 					this.currentPlayIndex++;
  153. 					if (this.currentPlayIndex >= this.enabledSliderIndexArray.length) {
  154. 						clearInterval(this.playInter);
  155. 						this.currentPlayIndex = 0;
  156. 						this.isPlaying = false;
  157. 						return;
  158. 					}
  159. 					this.currentValue = this.enabledSliderIndexArray[this.currentPlayIndex];
  160. 				}, this.playInterval);
  161. 			},
  162. 			pause() {
  163. 				this.isPlaying = false;
  164. 				clearInterval(this.playInter);
  165. 			}
  166. 		},
  167. 		beforeDestroy() {
  168. 			clearInterval(this.playInter);
  169. 		}
  170. 	}
  171. </script>
  172.  
  173. <style lang="less" scoped>
  174. 	.hidden {
  175. 		display: none;
  176. 	}
  177. 	.sutpc-play-slider {
  178. 		padding: @side-gap @side-gap + 20px @side-gap @side-gap;
  179. 		color: @color-primary;
  180. 		display: flex;
  181. 		flex-direction: column;
  182. 		font-size: 12px;
  183. 		position: absolute;
  184. 		right: 0;
  185. 		left: 0;
  186. 		margin: auto;
  187. 		bottom: @side-gap;
  188. 		z-index: 1500;
  189. 		width: 680px;
  190. 		.panel-bg;
  191. 		.box-shadow;
  192. 		.play-wrap {
  193. 			display: flex;
  194. 			align-items: center;
  195. 			width: 100%;
  196. 			flex: 1;
  197. 		}
  198. 		.slider-wrap {
  199. 			flex: 1;
  200. 			width: 0;
  201. 		}
  202. 		.svg-icon {
  203. 			font-size: 26px;
  204. 			cursor: pointer;
  205. 			margin-right: @side-gap;
  206. 		}
  207. 	}
  208. </style>

components/slider.vue

  1. <template>
  2. 	<div
  3. 		class="sutpc-slider"
  4. 		@mouseleave="containerMouseleaveHandler"
  5. 		@mousedown="containerMousedownHandler"
  6. 		@mouseup="containerMouseupHandler"
  7. 		@mousemove="containerMousemoveHandler"
  8. 		ref="container"
  9. 	>
  10. 		<span
  11. 			v-for="(item, index) in sliderData"
  12. 			:key="index"
  13. 			:class="getItemClass(item)"
  14. 			:style="getItemStyle(item, index)"
  15. 			@mousedown="mousedownHandler(item, $event)"
  16. 		></span>
  17. 		<div
  18. 			class="block"
  19. 			:style="getBlockStyle"
  20. 		>
  21. 			<div
  22. 				class="block-tooltip"
  23. 				v-text="tooltipContent"
  24. 			/>
  25. 		</div>
  26. 		<div class="interval-wrap">
  27. 			<template v-for="inter in intervalArray">
  28. 				<span
  29. 					class="interval"
  30. 					:key="inter"
  31. 					v-if="interFilter ? interFilter(inter) : true"
  32. 					:style="getIntervalStyle(inter)"
  33. 				>
  34. 					{{ interFormat ? interFormat(inter, getValueType(inter)) : inter }}
  35. 					<i
  36. 						class="interval-tick"
  37. 						:class="getIntervalClass(inter)"
  38. 					/>
  39. 				</span>
  40. 			</template>
  41. 		</div>
  42. 	</div>
  43. </template>
  44.  
  45. <script>
  46. 	// v-model 当前所在的时间片
  47. 	// @change 选择的时间片变化时，回传出去
  48. 	export default {
  49. 		props: {
  50. 			step: {
  51. 				type: Number,
  52. 				default: 1
  53. 			},
  54. 			/**
  55. 			 * [{from, to, type: 'predict|enabled|disabled'}]
  56. 			 */
  57. 			sliderData: {
  58. 				type: Array,
  59. 				default: function () {
  60. 					return [];
  61. 				}
  62. 			},
  63. 			value: {
  64. 				type: Number,
  65. 				default: 0
  66. 			},
  67. 			interFilter: {
  68. 				type: Function,
  69. 				default: value => value
  70. 			},
  71. 			interFormat: {
  72. 				type: Function,
  73. 				default: value => value
  74. 			},
  75. 			tooltipFormat: {
  76. 				type: Function,
  77. 				default: value => value
  78. 			},
  79. 			debounce: {
  80. 				type: Number,
  81. 				default: 0
  82. 			},
  83. 			version: {
  84. 				type: [Number, String],
  85. 				default: 1
  86. 			}
  87. 		},
  88. 		data() {
  89. 			return {
  90. 				// 原始值，在绘制的时候需要除以step
  91. 				currentValue: this.value,
  92. 				// 是否鼠标按住中
  93. 				isMouseDown: false,
  94. 			}
  95. 		},
  96. 		computed: {
  97. 			tooltipContent() {
  98. 				return this.tooltipFormat && this.tooltipFormat(this.currentValue, this.getValueType(this.currentValue));
  99. 			},
  100. 			intervalArray() {
  101. 				let arr = [];
  102. 				for (let i = this.minValue; i <= this.maxValue; i++) {
  103. 					arr.push(i);
  104. 				}
  105. 				return arr;
  106. 			},
  107. 			maxValue() {
  108. 				let max = Number.NEGATIVE_INFINITY;
  109. 				this.sliderData.forEach(({ from, to, type }) => {
  110. 					max = Math.max(from, max, to);
  111. 				});
  112. 				return max;
  113. 			},
  114. 			minValue() {
  115. 				let min = Number.POSITIVE_INFINITY;
  116. 				this.sliderData.forEach(({ from, to, type }) => {
  117. 					min = Math.min(from, min, to);
  118. 				});
  119. 				return min;
  120. 			},
  121. 			totalInter() {
  122. 				return this.maxValue - this.minValue;
  123. 			},
  124. 			getBlockStyle() {
  125. 				if (this.currentValue === '' || this.currentValue < this.minValue) {
  126. 					return {
  127. 						display: 'none'
  128. 					}
  129. 				}
  130. 				return {
  131. 					left: ((this.currentValue - this.minValue) / this.totalInter) * 100 + '%'
  132. 				}
  133. 			},
  134. 			stepWidth() {
  135. 				return this.$refs.container.offsetWidth / (this.totalInter / this.step);
  136. 			}
  137. 		},
  138. 		methods: {
  139. 			getIntervalClass(interval) {
  140. 				const havePredict = this.sliderData.find(item => item.type === 'predict');
  141. 				const [{ to: enabled }] = this.sliderData;
  142. 				if (interval <= enabled + (havePredict ? 20 : 0)) {
  143. 					return 'enabled'
  144. 				} else {
  145. 					return 'disabled'
  146. 				}
  147. 			},
  148. 			getIntervalStyle(interval) {
  149. 				return {
  150. 					marginLeft: ((interval - this.minValue) / this.totalInter) * 100 + '%'
  151. 				}
  152. 			},
  153. 			getItemClass({ type }) {
  154. 				return {
  155. 					'enabled': 'enabled',
  156. 					'disabled': 'disabled',
  157. 					'predict': 'predict'
  158. 				}[type || 'enabled'];
  159. 			},
  160. 			getItemStyle({ from, to }, index) {
  161.  
  162. 				let itemWidth = null;
  163.  
  164. 				// v1的数据区间是断节的，类似[{from: 0, to: 2}, {from: 3, to: 5}]，经确认后认为该区间划分不合理，因此升级了v2
  165. 				if (this.version == 1) {
  166. 					// 因为区间的不连续，区间的宽度需要+1，例如0-2，则区间宽度是 2 - 0 + 1 * 单位宽度
  167. 					itemWidth = ((to - from + 1) / this.totalInter) * 100 + '%';
  168. 					// 最后一个区间则不能+1，否则最后会多出一段多余的
  169. 					if (index >= this.sliderData.length - 1) {
  170. 						itemWidth = ((to - from) / this.totalInter) * 100 + '%';
  171. 					}
  172. 				}
  173. 				// v2的数据区间格式如下：[{from: 0, to: 3}, {from:3, to:5}]，2个区间之间是连续的
  174. 				else {
  175. 					itemWidth = ((to - from) / this.totalInter) * 100 + '%';
  176. 				}
  177.  
  178. 				// 最前和最后一个区间，宽度加长，往左边和右边突出一点
  179. 				if (index <= 0 || index >= this.sliderData.length - 1) {
  180. 					return {
  181. 						width: `calc(${itemWidth} + 3px)`
  182. 					}
  183. 				}
  184.  
  185. 				return {
  186. 					width: itemWidth
  187. 				}
  188. 			},
  189. 			mousedownHandler({ type }, e) {
  190. 				if (type === 'disabled') {
  191. 					e.stopPropagation();
  192. 					e.preventDefault();
  193. 					return false;
  194. 				}
  195. 			},
  196. 			containerMousedownHandler(e) {
  197. 				if (e.target === e.currentTarget) {
  198. 					return;
  199. 				}
  200. 				let { offsetWidth } = e.currentTarget;
  201. 				// 鼠标点击位置相对于滑动条的左边距离
  202. 				let offsetX = e.clientX - e.currentTarget.getBoundingClientRect().left;
  203. 				this.resetRealBlockPos(offsetX);
  204.  
  205. 				this.isMouseDown = true;
  206. 			},
  207. 			containerMouseupHandler(e) {
  208. 				this.isMouseDown = false;
  209. 			},
  210. 			containerMousemoveHandler(e) {
  211. 				if (!this.isMouseDown) {
  212. 					return;
  213. 				}
  214. 				let { offsetWidth } = e.currentTarget;
  215. 				// 鼠标点击位置相对于滑动条的左边距离
  216. 				let offsetX = e.clientX - e.currentTarget.getBoundingClientRect().left;
  217. 				this.resetRealBlockPos(offsetX);
  218. 			},
  219. 			containerMouseleaveHandler() {
  220. 				this.isMouseDown = false;
  221. 			},
  222. 			resetRealBlockPos(offsetX) {
  223.  
  224. 				let currentValue = offsetX / this.stepWidth * this.step + this.minValue;
  225.  
  226. 				if (currentValue > this.maxValue || currentValue < this.minValue) {
  227. 					return;
  228. 				}
  229.  
  230. 				// v1的数据区间是断节的，类似[{from: 0, to: 2}, {from: 3, to: 5}]，经确认后认为该区间划分不合理，因此升级了v2
  231. 				if (this.version == 1) {
  232. 					for (let { from, to, type } of this.sliderData) {
  233. 						if (currentValue >= from &&
  234. 							currentValue <= to + 1 &&
  235. 							type === 'disabled') {
  236. 							return;
  237. 						}
  238. 					}
  239. 				}
  240. 				// v2的数据区间格式如下：[{from: 0, to: 3}, {from:3, to:5}]，2个区间之间是连续的
  241. 				else {
  242. 					for (let { from, to, type } of this.sliderData) {
  243. 						if (currentValue >= from &&
  244. 							currentValue <= to &&
  245. 							type === 'disabled') {
  246. 							return;
  247. 						}
  248. 					}
  249. 				}
  250.  
  251. 				this.currentValue = Math.round(currentValue);
  252.  
  253. 				let currentType = this.getValueType(this.currentValue);
  254.  
  255. 				this.$emit("move", {
  256. 					value: this.currentValue,
  257. 					type: currentType
  258. 				});
  259. 			},
  260. 			getValueType(value) {
  261. 				let valueType = '';
  262. 				for (let { from, to, type } of this.sliderData) {
  263. 					if (value >= from && value <= to) {
  264. 						valueType = type;
  265. 					}
  266. 				}
  267. 				return valueType;
  268. 			}
  269. 		},
  270. 		watch: {
  271. 			currentValue() {
  272. 				let currentType = this.getValueType(this.currentValue);
  273. 				if (this.debounce <= 0) {
  274. 					this.$emit("input", this.currentValue);
  275. 					this.$emit("change", {
  276. 						value: this.currentValue,
  277. 						type: currentType
  278. 					});
  279. 				}
  280. 				else {
  281. 					clearTimeout(this.debounceTimeout);
  282. 					this.debounceTimeout = setTimeout(() => {
  283. 						this.$emit("input", this.currentValue);
  284. 						this.$emit("change", {
  285. 							value: this.currentValue,
  286. 							type: currentType
  287. 						});
  288. 					}, this.debounce);
  289. 				}
  290. 			},
  291. 			value() {
  292. 				this.currentValue = this.value;
  293. 			}
  294. 		}
  295. 	}
  296. </script>
  297. <style lang="less" scoped>
  298. 	.sutpc-slider {
  299. 		position: relative;
  300. 		display: flex;
  301. 		justify-content: center;
  302. 		align-items: center;
  303. 		background: fadeout(@color-primary, 90%);
  304. 		height: 12px;
  305. 		> span {
  306. 			flex-shrink: 0;
  307. 			height: 3px;
  308. 			background: #ccc;
  309. 			box-sizing: border-box;
  310. 			&:first-of-type {
  311. 				border-top-left-radius: 3px;
  312. 				border-bottom-left-radius: 3px;
  313. 			}
  314. 			&:last-of-type {
  315. 				border-top-right-radius: 3px;
  316. 				border-bottom-right-radius: 3px;
  317. 			}
  318. 			&.enabled {
  319. 				cursor: pointer;
  320. 			}
  321. 		}
  322. 		.block {
  323. 			position: absolute;
  324. 			left: 0;
  325. 			top: 50%;
  326. 			transform: translateY(-50%) translateX(-50%);
  327. 			border-radius: 100%;
  328. 			user-select: none;
  329. 			transition: all 0.1s;
  330. 			cursor: grab;
  331. 			z-index: 1;
  332. 			height: 12px;
  333. 			width: 12px;
  334. 			box-sizing: border-box;
  335. 			border: none;
  336. 			background: @color-primary;
  337.  
  338. 			.block-tooltip {
  339. 				position: absolute;
  340. 				left: 50%;
  341. 				top: -2 * @side-gap;
  342. 				transform: translateX(-50%);
  343. 				padding: 5px;
  344. 				.box-shadow;
  345. 				.panel-bg;
  346. 				border-radius: @border-radius;
  347. 				color: @text-color-regular;
  348.  
  349. 				&::after {
  350. 					content: "";
  351. 					position: absolute;
  352. 					left: 50%;
  353. 					transform: translateX(-50%);
  354. 					bottom: -6px;
  355. 					border-right: 6px solid transparent;
  356. 					border-left: 6px solid transparent;
  357. 					border-top: 6px solid @color-primary;
  358. 					.box-shadow;
  359. 				}
  360. 			}
  361. 		}
  362. 		.interval-wrap {
  363. 			position: absolute;
  364. 			margin-top: 12px;
  365. 			left: 0;
  366. 			right: 0;
  367.             top: 0;
  368. 			font-size: 12px;
  369. 			.interval {
  370. 				position: absolute;
  371. 				left: 0;
  372. 				top: 0;
  373. 				transform: translateX(-50%);
  374. 				white-space: nowrap;
  375. 				font-size: @font-size-small;
  376. 				color: @text-color-secondary;
  377. 			}
  378. 			.interval-tick {
  379. 				position: absolute;
  380. 				left: 50%;
  381. 				transform: translateX(-50%);
  382. 				.panel-bg;
  383. 				width: 12px;
  384. 				height: 12px;
  385. 				top: -12px;
  386. 				border-radius: 50%;
  387. 				box-sizing: border-box;
  388. 				border: 3px solid @color-primary;
  389.  
  390. 				&.disabled {
  391. 					border-color: @text-color-placeholder;
  392. 				}
  393. 			}
  394. 		}
  395. 	}
  396. </style>
  397.  
  398. <style lang="less">
  399. 	.slider-tooltip {
  400. 		border: none;
  401. 		.box-shadow;
  402.  
  403. 		.popper__arrow {
  404. 			&::after {
  405. 				border-top-color: @color-primary !important;
  406. 			}
  407. 		}
  408. 	}
  409. 	.sutpc-slider {
  410. 		> span {
  411. 			&.enabled {
  412. 				background: @color-primary;
  413. 			}
  414. 			&.predict {
  415. 				background: linear-gradient(
  416. 					to right,
  417. 					@color-primary 50%,
  418. 					transparent 0
  419. 				);
  420. 				background-size: @side-gap-medium 100%;
  421. 			}
  422. 		}
  423. 		.block {
  424. 			border: 2px solid @color-primary;
  425. 		}
  426. 		.interval-wrap {
  427. 			color: @text-color-secondary;
  428. 		}
  429. 	}
  430. </style>

使用组件

  1. <template>
  2.     <PlaySlider
  3. 			:sliderData="sliderData"
  4. 			v-model="currentPeriod"
  5. 			:timePrecision="5"
  6. 			:playInter="4000"
  7. 			:debounce="300"
  8. 	/>
  9. </template>
  10.  
  11. <script>
  12.     import PlaySlider from 'components/time-slider';
  13.     import { state, action } from '../store';
  14.     // 播放器的最大时间
  15. 	const SLIDER_MAX_VALUE = 288;
  16.  
  17.     export default {
  18. 		components: {
  19. 			PlaySlider,
  20. 		},
  21.         data: () => ({
  22. 			sliderData: [],
  23. 		}),
  24.         computed: {
  25. 			//当前时间片
  26. 			currentPeriod: {
  27. 				get: () => state.currentPeriod,
  28. 				set: (value) => action.updateCurrentPeriod(value)
  29. 			},
  30. 		},
  31.         watch: {
  32. 			currentPeriod(value) {
  33. 				//如果不是currentPeriod第一次设置则返回
  34. 				if (this.sliderData.length) {
  35. 					return;
  36. 				}
  37.  
  38. 				this.sliderData = [{
  39. 					from: 1,
  40. 					to: value,
  41. 					type: 'enabled'
  42. 				}];
  43.  
  44. 				if (value >= SLIDER_MAX_VALUE) {
  45. 					return;
  46. 				}
  47.  
  48. 				let disabledStart = value + 1;
  49. 				if (disabledStart > SLIDER_MAX_VALUE) {
  50. 					return;
  51. 				}
  52.  
  53. 				this.sliderData.push({
  54. 					from: disabledStart,
  55. 					to: SLIDER_MAX_VALUE,
  56. 					type: 'disabled'
  57. 				});
  58. 				//非响应式
  59. 				this.sliderData = Object.freeze(this.sliderData);
  60. 			}
  61. 		},
  62.     }
  63. </script>

store.js

  1. export default {
  2.     state: {
  3.         //当前时间片
  4.         currentPeriod: null,
  5.     },
  6.     mutations:{
  7.         setCurrentPeriod(state, value) {
  8.             state.currentPeriod = value;
  9.         },
  10.     },
  11.     action:{
  12.         updateCurrentPeriod({ commit }, newPeriod) {
  13.             commit("setCurrentPeriod", newPeriod);
  14.         }
  15.     }
  16. };

 

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Cpp五条/article/detail/130207
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号