l-ynet-timer-project

2.1.0 • Public • Published

安装使用

  1. 安装依赖
npm install l-ynet-timer-project
  1. 注册到main.js
import Vue from 'vue';
import TimerProject from 'l-ynet-timer-project';
Vue.use(TimerProject);

使用方法

	<div id="app">
		<h1>
			
		</h1>

		<div
			class="example__container"
			v-for="example in examples"
			:key="example.title"
		>
			<h1>{{ example.title }}</h1>
			<circular-count-down-timer
				:steps="example.steps" // 倒计时秒数
				:stroke-color="example.strokeColor" // 进度条颜色
			
			/>
		</div>
	</div>
</template>

<script>
export default {
	name: 'app',
	data(){
		return {
			examples: [
				{
					title: 'Simple',
					circles: [
						{
							id: '1',
							steps: 10,
							strokeColor:'red'
						}
					]
				}
			]
		};
	}
};
</script>

<style>
#app {
	width: 100%;
	font-family: 'Avenir', Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	display: flex;
	flex-direction: column;
	align-items: center;
	color: #2c3e50;
	background-color: aliceblue;
}
.example__container {
	text-align: center;
	margin-bottom: 50px;
	background-color: #6de0f3;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.circle__container--1 {
	width: 420px;
	display: flex;
	flex-direction: row-reverse !important;
	flex-wrap: wrap;
}
</style>```

Package Sidebar

Install

npm i l-ynet-timer-project

Weekly Downloads

0

Version

2.1.0

License

MIT

Unpacked Size

1.02 MB

Total Files

16

Last publish

Collaborators

  • liyu-001