vue中使用时间插件vue使用laydate

Posted 2022-05-03 qq376324789

        <input id="time1"  readonly="readonly"  placeholder="这里选择时间" v-model=‘input3‘ />
        ——
        <input id="time2" readonly="readonly" placeholder="这里选择时间" v-model=‘input4‘/>

在vue数据data中定义两个对应的数据

        input3: ‘‘,
        input4: ‘‘,

在vue初始化时处理laydata绑定事件  ，这里使用的延迟加载，为了避免顺序问题导致无法使用

在时间选择结束时将值赋给vue的数据，不然vue的数据并没有随着时间改变而改变

         //用于数据初始化
      created:function()                  
          setTimeout( function()
                laydate.render(
                      elem: "#time1", //指定元素
                      type: ‘datetime‘,
                      format:‘yyyy-MM-dd HH:mm:ss‘,
                      trigger: ‘click‘,
                      done:function(value, date, endDate)
                          vue.input3=value;
                          
                    );
                laydate.render(
                      elem: "#time2", //指定元素
                      type: ‘datetime‘,
                      format:‘yyyy-MM-dd HH:mm:ss‘,
                      trigger: ‘click‘,
                      done:function(value, date, endDate)
                          vue.input4=value;
                          
                    );
              , 5* 100 );
      ,

 需要引入vue.js和laydate.js