我有一个数据表，它存储了各种日期和时间以及一个字符串.日期功能完美，但时间和字符串显示为无效时间.为什么会发生这种情况？
以下是一个响应示例:
"permission_date":"2024—03—08T18:08:08.783Z"， "permission_start_date":"2024—03—08T18:08:10.590Z"， "permission_end_date":"2024—03—26T18:08:13.574Z"， "permission_start_time":"04:00 AM"，"permission_end_time":"06:00 PM "，"理由":"asdf "，
下面是该表的缩略版本.
| permission_date | permission_start_date | permission_start_time | justification |
|---|---|---|---|
| 2024-03-08 | 2024-03-08 | Invalid date | Invalid date |
如表所示，日期处理得很好，但其他一切都不是. 我的表格助手，我在其中格式化数据:
export const TableHelpers = {
data() {
return {
tableColumns: [{
title: this.$t('permission_date'),
type: 'custom-html',
key: 'permission_date',
modifier: (value) => {
return moment(String(value)).format('YYYY-MM-DD');
},
},
{
title: this.$t('permission_start_date'),
type: 'custom-html',
key: 'permission_start_date',
modifier: (value) => {
return moment(String(value)).format('YYYY-MM-DD');
},
},
{
title: this.$t('permission_start_time'),
type: 'custom-html',
key: 'permission_start_time',
modifier: (value) => {
return moment(String(value)).format('hh:mm');
},
},
{
title: this.$t('permission_end_date'),
type: 'custom-html',
key: 'permission_end_date',
modifier: (value) => {
return moment(String(value)).format('YYYY-MM-DD');
},
},
{
title: this.$t('permission_end_time'),
type: 'custom-html',
key: 'permission_end_time',
modifier: (value) => {
return moment(String(value)).format('hh:mm');
},
},
{
title: this.$t('justification'),
type: 'custom-html',
key: 'justification',
modifier: (value) => {
return moment(String(value));
},
},
}
},
}用户输入数据的模式.
<div class="form-group row align-items-center">
<label class="col-md-12">
{{ $t('permission_date') }}
</label>
<app-input class="col-sm-8"
type="date"
v-model="inputs.permission_date"
:placeholder="$t('select_valid_date')"/>
</div>
<div class="form-group row align-items-center">
<label class="col-md-12">
{{ $t('permission_start_date') }}
</label>
<app-input class="col-sm-8"
type="date"
v-model="inputs.permission_start_date"
:placeholder="$t('select_valid_date')"/>
</div>
<div class="form-group row align-items-center">
<label class="col-md-12">
{{ $t('permission_start_time') }}
</label>
<app-input class="col-sm-8"
type="time"
v-model="inputs.permission_start_time"
:placeholder="$t('select_valid_time')"/>
</div>
<div class="form-group row align-items-center">
<label class="col-md-12">
{{ $t('permission_end_date') }}
</label>
<app-input class="col-sm-8"
type="date"
v-model="inputs.permission_end_date"
:placeholder="$t('select_valid_date')"/>
</div>
<div class="form-group row align-items-center">
<label class="col-md-12">
{{ $t('permission_end_time') }}
</label>
<app-input class="col-sm-8"
type="time"
v-model="inputs.permission_end_time"
:placeholder="$t('select_valid_time')"/>
</div>
<div class="form-group row align-items-center">
<label for="inputs_name" class="col-md-12">
{{ $t('Justification') }}
</label>
<app-input id="inputs_name" class="col-sm-9" type="textarea"
v-model="inputs.justification"
:placeholder="$t('textarea_field')" :required="true" />
</div>