我正在尝试使用Vuetify的日期选择器组件。我的日期来自我的C#哪个DateTime是格式。如何使用验证日期选择器进行双向数据绑定?
我想显示上一个日期a允许用户更改它。
谢谢
<v-menu ref="menu" v-model="menu" :close-on-content-click="false" :nudge-right="40" :return-value.sync="date" lazy transition="scale-transition" offset-y full-width min-width="290px">
<template v-slot:activator="{ on }">
<v-text-field v-model="**editedItem.activationdate**" label="Picker in menu" prepend-icon="event" readonly v-on="on"></v-text-field>
</template>
<v-date-picker v-model="**editedItem.activationdate**" no-title scrollable>
<v-btn flat color="primary" @click="menu = false">Cancel</v-btn>
<v-btn flat color="primary" @click="$refs.menu.save(editedItem.activationdate)">OK</v-btn>
</v-date-picker>
</v-menu>
您必须将C#DateTime-Object转换为JavaScript Date-Object。在JS中,您可以通过自1970年1月1日以来的毫秒数来创建一个日期对象(新日期(0(将为您提供1970-01-01(。对于获取此数字,您可以使用以下扩展名:
public static class DateTimeExtensions
{
private static readonly long DatetimeMinTimeTicks =
(new DateTime(1970, 1, 1, 0, 0, 0, DateTimeKind.Utc)).Ticks;
public static long ToJavaScriptMilliseconds(this DateTime dt)
{
return (long)((dt.ToUniversalTime().Ticks - DatetimeMinTimeTicks) / 10000);
}
}
所以现在您可以在后端做:
long numberOfMilliseconds = DateTime.Now.ToJavaScriptMilliseconds(); //C#
并将其发送到前端,因此您可以使用JavaScript进行此操作:
var myDate = new Date(editedItem.numberOfMilliseconds); //JavaScript