I recently started working with React (Typescript) and I am trying to display a date from the database without including the time.
Here is my Interface:
interface Games {
g_Id: number;
g_Title: string;
g_Genre: string;
g_Plattform: string;
g_ReleaseDate: Date;
g_Price: number;}
Below is my output method:
private static renderGamesTable(games: Games[]) {
console.log(games)
return <table className='table'>
<thead>
<tr>
<th>Title</th>
<th>Genre</th>
<th>Plattform</th>
<th>Release Date</th>
<th>Price</th>
</tr>
</thead>
<tbody>
{games.map(games =>
<tr key={games.g_Id}>
<td>{games.g_Title}</td>
<td>{games.g_Genre}</td>
<td>{games.g_Plattform}</td>
<td>{games.g_ReleaseDate}</td>
<td>{games.g_Price}</td>
</tr>
)}
</tbody>
</table>;
}
Database design:
CREATE TABLE [dbo].[Games] (
[G_Id] INT IDENTITY (1, 1) NOT NULL,
[G_Genre] NVARCHAR (100) NOT NULL,
[G_Plattform] NVARCHAR (100) NOT NULL,
[G_Price] DECIMAL (18, 2) NOT NULL,
[G_ReleaseDate] DATETIME2 (7) NOT NULL,
[G_Title] NVARCHAR (100) NOT NULL,
CONSTRAINT [PK_Games] PRIMARY KEY CLUSTERED ([G_Id] ASC));
I am using .Net core and MS-Sql. I have omitted the fetch method and controllers as I deemed them unnecessary for this issue, but feel free to ask for more information if needed.
What I have tried so far:
- Changing the datatype in the Database
- Attempting to convert the Date (using getyear or toDateString ...etc)
- Trying to format the date using moment.js
- Creating a new datatype that only accepts the date
Unfortunately, none of these solutions seem to work at the moment. It's possible that I am missing something obvious due to being new to React, so any guidance would be appreciated :)