无法格式化绑定值(mengxiong10 / vue2-datepicker)
无法格式化绑定值(mengxiong10 / vue2-datepicker)
提问于 2020-05-28 09:18:44
无法设置绑定值，按文档编码。
JsFiddle示例： $[https://jsfiddle.net/zarpio/8stw7rvc/13/ ]
或
完整代码：
<!DOCTYPE html>
<html>
<head>
<title>Vue2 Datepicker</title>
</head>
<body>
<div id="app">
<section>
<p>format</p>
<date-picker v-model="value1" value-type="format" format="YYYY-MM-DD"></date-picker>
<p>
<code>v-model = {{ value1 }}</code>
</p>
</section>
<section>
<p>date (Date Object)</p>
<date-picker v-model="value2" value-type="date"></date-picker>
<p>
<code>v-model = {{ value2 }}</code>
</p>
</section>
<section>
<p>timestamp</p>
<date-picker v-model="value3" value-type="timestamp"></date-picker>
<p>
<code>v-model = {{ value3 }}</code>
</p>
</section>
<section>
<p>DD/MM/YYYY</p>
<date-picker v-model="value4" value-type="DD/MM/YYYY" format="YYYY-MM-DD"></date-picker>
<p>
<code>v-model = {{ value4 }}</code>
</p>
</section>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue2-datepicker@1.9.6/dist/build.min.js"></script>
<script type="text/javascript">
Vue.use(DatePicker.default);
new Vue({
el: '#app',
data: {
value1: '',
value2: '',
value3: '',
value4: '',
lang: {
formatLocale: {
firstDayOfWeek: 1,
},
monthBeforeYear: false,
},
},
methods: {
},
computed: {
}
});
</script>
</body>
</html>问题:您可以看到以字符串格式输出(清华于2020年5月28日00:00:00)，但我需要在format=中使用“2020 -05- 28”。
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-05-31 20:06:05
在这个问题中使用的包是旧的，下面是工作正常的。
<html>
<head>
<title>Vue2 Datepicker</title>
<link href="http://p3backend.test/frontend/default/assets/css/bootstrap.min.css">
<link rel="stylesheet" href="https://unpkg.com/vue2-datepicker/index.css">
</head>
<body>
<div id="app">
<section>
<p>format</p>
<date-picker v-model="value1" value-type="format" format="YYYY-MM-DD"></date-picker>
<p>
<code>v-model = {{ value1 }}</code>
</p>
</section>
<section>
<p>date (Date Object)</p>
<date-picker v-model="value2" value-type="date"></date-picker>
<p>
<code>v-model = {{ value2 }}</code>
</p>
</section>
<section>
<p>timestamp</p>
<date-picker v-model="value3" value-type="timestamp"></date-picker>
<p>
<code>v-model = {{ value3 }}</code>
</p>
</section>
<section>
<p>DD/MM/YYYY</p>
<date-picker v-model="value4" value-type="DD/MM/YYYY" format="YYYY-MM-DD"></date-picker>
<p>
<code>v-model = {{ value4 }}</code>
</p>
</section>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue2-datepicker/index.min.js"></script>
<script type="text/javascript">
new Vue({
el: '#app',
data: {
value1: '',
value2: '',
value3: '',
value4: '',
},
});
</script>
</body>
</html>```页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62061154
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号