Bootstrap

java 字符串日期字段格式化前端显示

在 Java 应用程序中,如果你有一个字符串类型的日期字段,并希望将其格式化后显示在前端,可以通过多种方式实现。这通常涉及到在后端将字符串转换为 Date 或 LocalDateTime 等对象,然后使用适当的注解或配置来确保它们以正确的格式序列化为 JSON 发送到前端。以下是几种常见方法:

方法一:使用 @JsonFormat 注解 (Jackson)

如果你使用的是 Jackson 来处理 JSON 序列化和反序列化,可以在实体类的日期字段上添加 @JsonFormat 注解,以便控制日期格式。

示例:

假设你有一个字符串字段表示日期,你可以先将其转换为 LocalDateTime 或 Date 对象,然后应用注解进行格式化。

import com.fasterxml.jackson.annotation.JsonFormat;
import java.time.LocalDateTime;

public class Event {
    // 假设这是从数据库或其他来源获取的字符串日期
    private String eventDateString;

    // 使用 getter 将字符串转换为 LocalDateTime 并返回
    @JsonFormat(shape = JsonFormat.Shape.STRING, pattern = "yyyy-MM-dd HH:mm:ss", timezone = "GMT+8")
    public LocalDateTime getEventDate() {
        return LocalDateTime.parse(eventDateString, DateTimeFormatter.ofPattern("yyyy-MM-dd'T'HH:mm:ss"));
    }

    // setters and other methods
}

方法二:使用自定义 Getter 方法

你可以创建一个自定义的 getter 方法来格式化字符串日期,而不改变原来的字符串字段。

示例:

import java.time.LocalDateTime;
import java.time.format.DateTimeFormatter;

public class Event {
    private String eventDateString;

    // 自定义 getter 方法用于格式化输出
    public String getFormattedEventDate() {
        try {
            LocalDateTime dateTime = LocalDateTime.parse(eventDateString, DateTimeFormatter.ISO_LOCAL_DATE_TIME);
            return dateTime.format(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss"));
        } catch (Exception e) {
            // 处理解析错误,返回原始字符串或默认值
            return eventDateString;
        }
    }

    // getters and setters for eventDateString
}

方法三:使用 ObjectMapper 和全局配置

如果你想为整个应用程序设置统一的日期格式,可以在配置类中调整 ObjectMapper 的行为。对于字符串日期,你可以注册一个自定义模块来处理特定格式的字符串。

示例(Spring Boot):

import com.fasterxml.jackson.databind.ObjectMapper;
import com.fasterxml.jackson.databind.SerializationFeature;
import com.fasterxml.jackson.datatype.jsr310.JavaTimeModule;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;

@Configuration
public class JacksonConfig {

    @Bean
    public ObjectMapper objectMapper() {
        ObjectMapper mapper = new ObjectMapper();
        mapper.registerModule(new JavaTimeModule());
        mapper.disable(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS);
        mapper.setDateFormat(new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"));
        return mapper;
    }
}

方法四:使用 @JsonDeserialize 和 @JsonSerialize

你可以创建自定义的序列化器和反序列化器来处理特定格式的字符串日期。

示例:

import com.fasterxml.jackson.core.JsonParser;
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.DeserializationContext;
import com.fasterxml.jackson.databind.JsonDeserializer;
import com.fasterxml.jackson.databind.JsonSerializer;
import com.fasterxml.jackson.databind.SerializerProvider;
import com.fasterxml.jackson.databind.annotation.JsonDeserialize;
import com.fasterxml.jackson.databind.annotation.JsonSerialize;
import java.io.IOException;
import java.time.LocalDateTime;
import java.time.format.DateTimeFormatter;

public class Event {

    @JsonSerialize(using = CustomDateSerializer.class)
    @JsonDeserialize(using = CustomDateDeserializer.class)
    private String eventDateString;

    // getters and setters
}

class CustomDateSerializer extends JsonSerializer<String> {
    private static final DateTimeFormatter formatter = DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss");

    @Override
    public void serialize(String value, JsonGenerator gen, SerializerProvider serializers) throws IOException {
        LocalDateTime dateTime = LocalDateTime.parse(value, DateTimeFormatter.ISO_LOCAL_DATE_TIME);
        gen.writeString(dateTime.format(formatter));
    }
}

class CustomDateDeserializer extends JsonDeserializer<String> {
    private static final DateTimeFormatter formatter = DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss");

    @Override
    public String deserialize(JsonParser p, DeserializationContext ctxt) throws IOException, JsonProcessingException {
        String dateStr = p.getValueAsString();
        return LocalDateTime.parse(dateStr, formatter).format(DateTimeFormatter.ISO_LOCAL_DATE_TIME);
    }
}

方法五:前端 JavaScript 处理

虽然理想情况下应该在后端进行格式化,但有时候你可能也需要在前端对日期进行格式化。JavaScript 提供了多种库来简化这一过程,如 Luxon、Moment.js 或者内置的 Intl.DateTimeFormat。

示例(使用 Luxon):

<script src="https://cdn.jsdelivr.net/npm/[email protected]/build/global/luxon.min.js"></script>
<script>
    const dateString = "2023-04-05T12:34:56";
    const date = luxon.DateTime.fromISO(dateString);
    console.log(date.toFormat('yyyy-MM-dd HH:mm:ss')); // 输出:2023-04-05 12:34:56
</script>

方法六:使用 Thymeleaf 模板引擎(如果适用)

如果你使用 Thymeleaf 作为模板引擎,可以直接在模板中格式化日期。

示例:

<p th:text="${#temporals.format(#dates.create(event.eventDateString), 'yyyy-MM-dd HH:mm:ss')}">Event Date</p>

;