本文讲述了后端开发者在自学前端过程中，如何在Vue.js项目中引入并集成WdatePicker.js日期控件，以及在数据绑定和DOM操作上的实现，强调这仅作为个人学习实践，未来会进一步优化。
后端刚自学前端，遇到的问题备注：
1. 页面<head>部分引入Wdatepicer.js的插件，
<div id="app">
测试日期控件：<imput type="text" id="dateID" v-model="dateMd" ref="dateRef" placeholder="这是一个日历插件" />
</div>
2. VUE js处理部分
<script type="text/javascript">
new Vue({
el: '#app',
data: function() {
return {
dateMd: '', // 存页面的值
};
},
mounted: function() {
var that = this;
this.$nextTick(() => {
// 初始化日历控件，修复支持非VUE得日历插件
document.querySelector("#dateID").onclick = function() {
WdatePicker({
onpicked: function(date) { // 选中回填值
that.dateMd= this.value;
},
oncleared: function(date) { // 清空值
that.dateMd = "";
},
onclose: function(date) { // 控件关闭
that.dateMd = this.value;
},
})
};
});
}
});
</script>
注：上述方式仅属于个人学习笔记，不能保证性能，仅能参考使用，等后期学习OK，我再进行优化和更正。
6135
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
