我该如何使用日期选择器进行两种方式数据划船



我正在尝试使用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

最新更新