使用 laravel 转换 vue js 中的日期格式

Posted 2023-03-14

【中文标题】使用 laravel 转换 vue js 中的日期格式

【英文标题】：Convert date format in vue js with laravel

【发布时间】：2019-07-26 17:09:51

【问题描述】：

我正在使用 verta 库将公历日期转换为 laravel 中的回历日期 https://github.com/hekmatinasser/verta

在简单模式下（.blade.php 文件）我使用这样的代码：

 Verta($category->created_at)->format('%d %B %Y') 
for converting created_at

但在 Vue js 中，我无法访问我拥有的这种格式

category.created_at

如何用这种方法转换 vue js 日期？

【问题讨论】：

如果你想重用你在 laravel 中所做的事情，你需要先解析日期，然后再将它们返回到前端。您可以在读取数据库条目时使用突变（laravel.com/docs/5.8/eloquent-mutators）自动执行此操作

***.com/questions/46708110/…

【参考方案1】：

您可以在模型上使用 mutator 在返回日期之前对其进行解析。

public function getCreatedAtAttribute($value)

    return Verta($value)->format('%d %B %Y');

这应该在您的类别模型中定义

category.created_at

然后将包含已解析的日期

【讨论】：

是的，最好的方法是创建一个属性。不要忘记将它添加到附加数组中

as created_at 是一个实际的数据库字段，您不需要附加它（在这种特定情况下/问题中）

【参考方案2】：

很简单，你可以通过moment.js按照三个步骤完成。

第 1 步：

npm install moment --save

第 2 步：

import moment from "moment";

第 3 步：

export default 
    data() 
        return 
            moment: moment
        
     

完成。

现在在下面做

  moment(category.created_at).format("DD-MM-YYYY") 

【参考方案3】：

您可以使用vue-moment。

npm install vue-moment

...并且需要这样的插件：

Vue.use(require('vue-moment'));

然后，在您的应用程序中，您可以执行以下操作：

 someDate | moment("dddd, MMMM Do YYYY") 

【参考方案4】：

在 Laravel 端

1)
public function getCreatedAtAttribute($value)

    return $value->format('d-m-Y');


2)protected $casts = [
    'birthday'  => 'date:Y-m-d'
];

在 Vue .js 端制作过滤器

npm install moment

In  resources/js/app.js

import moment from 'moment';

Vue.filter('formatDate', function(value) 
    if (value) 
        return moment(String(value)).format('MM/DD/YYYY')
    
);

在 Vue 组件方面

 category.created_at | formatDate