这里的 jquery datetimepicker指的不是bootstrap版本
而是:
https://www.datetimepicker.cn/download/ 版本
问题:
当选定datetimepicker日期时,并没有给vue v-model 变量绑定值,但给v-model 设定值时,datetimepicker会取到值关响应
解决思路,jquery datetimepicker 没有设定v-model控件变量值,那提交表单时通过Jquery标签取值绑给v-model。
Html代码:
<div class="" id="app">
<input type="text" id="datetimepicker1" class="form-control form-control-sm" v-model="model.expire_time" autocomplete="off">
div>
js代码:
<script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
model : {expire_time: '',}
},
methods: {
update(){
this.model.expire_time=$('#datetimepicker1').val();
axios.post('/user/save.html',
this.model,
{headers: {}}).then(
res => (
(res.data.code === 0)?(
$('#myModal').modal("hide"),
location.reload(true)
)
:
(
this.error = res.data.message
)
)
)
.catch(function (error) { // 请求失败处理
console.log(error);
});
},
dateInit: function() {
var self = this;
var date = new Date();
$.datetimepicker.setLocale('zh');
$('#datetimepicker1').datetimepicker({
theme:'default',
format:'Y-m-d',
defaultDate:new Date(),
timepicker:false
});
}
},
mounted: function() {
this.dateInit()
}
});
</script>
注意:
这里用mounted()引入jquery事件,执行update()时通过
this.model.expire_time = $(‘#datetimepicker1’).val();进行绑定。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)