J'ai une API. Et je prends les données de cette API et l'affiche sur la page en tant que table de liste. Mais dans le champ temps strong>, je veux que seulement une partie de l'information est affichée sur ma page. Données affichées comme ceci: p> Mais j'en ai besoin pour être comme ça (seulement des heures et des minutes): P> Voici un composant qui affiche une liste de table (Tabletaha.js):
Importation réagit de "réagir"; p> avions.js (réducteur): p> app.js (composant principal ): p>
< BR>
Comment la mettre en œuvre dans mon cas? Juste s'il vous plaît sans liens, j'ai besoin d'aide spécifiquement dans ma situation. P>
3 Réponses :
Il s'agit simplement d'une question de formatage de la valeur de la date avant le rendu, vous ne voulez pas modifier aucun de votre code de réduction, par exemple
{data.map(item => {
const dt = new Date(item.actual);
const mins = dt.getMinutes();
return (
<tr key={item.ID}>
<td>{item.term}</td>
<td>{item.gateNo}</td>
<td>{`${dt.getHours()}:${mins < 10 ? '0' : ''}${mins}`}</td>
<td>
{item["airportToID.city_en"]
? item["airportToID.city_en"]
: item["airportFromID.city_en"]}
</td>
<td>{item.airline.en.name}</td>
<td>{item["planeTypeID.code"]}</td>
<td>{item.status}</td>
</tr>
)
})}
Merci beaucoup! Pouvez-vous m'aider à intégrer cela dans mon code? Je suis juste neuf pour la programmation ... Tout le code du projet dans Sandbox: CODESANDBOX.IO/s/...
@Tomasgidnop See Mise à jour , chèque Modifications apportées à Tabledata.js code>.
Merci encore! Vous n'avez changé que le fichier tabledata.js? Dans d'autres fichiers n'avez-vous pas modifié?
@Tomasgidnop Non, il vous suffit de changer Tabledata.js code>. Aussi, voir exemple mis à jour comme vous devez gérer des scénarios où les minutes sont <10
et ce que cela signifie minutes sont <10 code>? c'est-à-dire qu'est-ce que c'est?
par ailleurs, un certain temps est pas très bien maintenant, je marqué en rouge i.piccy.info/i9/a1979f2d7c62083299cd2956390641b7/1573477625/ ...
@Tomasgidnop C'est exactement ce que mes adresses mon code, je n'ai pas mis à jour la codesandbox, veuillez donc vous reporter au code de ma réponse
Pouvez-vous jeter un coup d'oeil à ma nouvelle question? Stackoverflow.com/Questtions/58806769/...
Vous pouvez faire quelque chose comme ceci: - puis vous pouvez les afficher dans votre composant. p> p>
Merci beaucoup! Pouvez-vous m'aider à intégrer cela dans mon code? Je suis juste neuf pour la programmation ... Tout le code du projet dans Sandbox: CODESANDBOX.IO/s/...
@Tomasgidnop J'ai mis à jour votre lien Sandbox. Veuillez vérifier si vous pouvez voir les modifications.
Non, je ne vois pas le changement.Triez-le comme ceci: 1) Dans le coin droit dans Sandbox, appuyez sur le bouton "Fork", il copie mon projet mais avec une nouvelle adresse. 2) apporter des modifications 3) Ecrivez-moi l'adresse du bac à sable copié
Oups, voici le lien préféré - codesandbox. io / s / ...
Merci encore! Vous n'avez changé que le fichier tabledata.js? Dans d'autres fichiers n'avez-vous pas modifié?
@Tomasgidnop Nope, je n'ai changé que tabledata.js
Selon ma réponse, cela ne suffit pas. Vous devez également gérer les minutes <10 minutes sinon vous obtenez des horaires tels que 4: 5 code> plutôt que 4:05 code>
@Shivratna Kumar Vous pouvez dire comment le faire? Je parle de: "minutes <10 minutes"
Vous pouvez créer un Date Objet Utilisez ensuite des méthodes sur l'objet de date, comme:
0:50
Seulement si vous êtes sur uc + 1 code> :)
@James ah oui bien sûr, mes excuses pour manquer cela dans ma réponse originale :)