如何使用 JavaScript Rails 更改 created_at 格式

在 Rails 应用程序中，created_at 字段常常用来记录新的记录创建的时间戳。然而，Rails 默认的 created_at 字段格式为 YYYY-MM-DD HH:mm:ss UTC。在一些情况下，我们需要将其格式化成其他的样式，例如 MM/DD/YYYY 或者 DD/MM/YYYY HH:mm:ss。这时候我们就需要使用 JavaScript 来更改 created_at 的格式。

第一步：获取 created_at 字段的值

在 Rails 视图中，我们可以使用 Ruby 的 strftime 方法来格式化日期。但是在 JavaScript 中，日期对象没有 strftime 方法。所以，我们需要先将 created_at 转化为 JavaScript 中的日期对象。

var createdAt = new Date('<%= @post.created_at %>');

这里的 <%= @post.created_at %> 是 Ruby 代码，将生成一个字符串，例如 "2021-09-10T12:34:56.000Z"。我们将这个字符串传入 JavaScript 的 Date 构造函数中，就可以得到一个 JavaScript 的日期对象 createdAt。

第二步：格式化日期对象

接下来，我们需要将日期对象 createdAt 格式化成我们想要的样式。JavaScript 的日期对象有一个 toLocaleString() 方法，可以将日期对象格式化为本地时间的字符串。但是它的输出形式是由浏览器设置的，很难满足我们的需求。

我们可以使用一个开源的 JavaScript 库 moment.js 来格式化日期对象。moment.js 可以自定义日期格式，并支持多语言格式化。我们可以在 Rails 的 asset pipeline 中使用 moment.js。

//= require moment

var createdAt = new Date('<%= @post.created_at %>');
var formattedDate = moment(createdAt).format('MM/DD/YYYY HH:mm:ss');

这里我们使用了 require moment 来加载 moment.js。然后，将日期对象 createdAt 传入 moment() 方法中，返回一个 moment 对象。最后，调用 format() 方法来格式化日期对象。

我们将日期格式的参数 "MM/DD/YYYY HH:mm:ss" 传入 format() 函数，moment.js 将自动将其格式化为我们想要的日期格式。

第三步：将格式化后的日期赋值给页面

最后一步是将格式化后的日期字符串赋值给页面中的 HTML 元素。

//= require moment

var createdAt = new Date('<%= @post.created_at %>');
var formattedDate = moment(createdAt).format('MM/DD/YYYY HH:mm:ss');
document.getElementById('post-created-at').innerHTML = formattedDate;

这里我们使用了 document.getElementById() 方法来获取页面中的元素，将其内部的 HTML 内容设置为格式化后的日期字符串 formattedDate。

结束语

通过这个例子，我们学习了如何使用 JavaScript Rails 更改 created_at 的格式。我们使用了 moment.js 来格式化日期对象，并将其赋值给 HTML 元素。希望这篇文章对你有所帮助。