vue+elementUi时间控件

jsp:

引用：   <link

rel="stylesheet" href="<%=path%>element/css/index.css">
          <script

type="text/javascript"

src="<%=path%>/vuejs/vue.js"></script>
          <script

type="text/javascript"

src="<%=path%>/my/page_element.js"></script>
          <script

src="<%=path%>/element/index.js"></script>

<el-date-picker  v-model="startTime" 

type="date" 

class="timeinput"

style='width:155px;height:

35px;' placeholder="开始日期"

:picker-options="pickerOptions0"></el-date-picker>
<span

class="samble">-</span>
<el-date-picker v-model="endTime" 

type="date"

class="timeinput"

style='width:155px;height:

35px;' placeholder="结束日期"

:picker-options="pickerOptions1"></el-date-picker>

js:

var

timeVue =
new
Vue({
          el:

'#timeVue',
          data: {
            startTime:

'',
            endTime:

'',
               pickerOptions0:{
                   disabledDate:

function(val) {  //disabledDate:时间限制
                   

if(!timeVue.endTime) {
                        

return
false;
                    }else

{
                        

return
val.getTime() > timeVue.endTime;
                    }
                      
                   }
               },
               pickerOptions1:{
                   disabledDate:

function(val) {
                    

if(!timeVue.startTime) {
                         

return
false;
                     }else

{
                         

return
val.getTime() < timeVue.startTime;
                     }
                    
                   }
               }
            
           }
     });