vue.js --------------时间选择器

很多项目中都会用到时间选择。下面列子中我写了一个实例

demo下载地址:https://download.csdn.net/download/zxd1314520/10634016

首先上效果图:

vue.js --------------时间选择器_第1张图片

1.先引入 cnpm install vue-date-time-m --save

2.在main.js里引入

import dateTime from 'vue-date-time-m';
Vue.component('data-time', dateTime);

3.在template

   
      
现在时间  {{msg}}
  
      
-
         
+
   

4.在所需要的script里面 必须绑定点击事件

5.根据项目要求 我修改了时间选择的主题颜色

 

css

.van-dialog__confirm,.van-dialog__confirm:active {
		color: #FF6600
}
	
.d-date-time-header,.d-date-time-bg{
		background: #FF6600!important;
}
.d-date-time-button a{
		color: #FF6600!important;
}

 

一个好看使用的时间选择就写完了。

还有其他如果你需要可以一起讨论。

 

你可能感兴趣的:(vue.js)