Utilisation méthodes pour modifier un élément d'une requête

Bonjour à tous,

Je viens de débuter VueJs pour mon alternance, je n’ai donc pas saisi l’ensemble des notions de base.

Je dois faire une interface utilisateur qui permet d’afficher des “acquisitions”, acquisitions que je récupère via une API. J’utilise donc Axios, qui fonctionne très bien.

J’affiche donc cette liste d’acquisitions comme ceci :

Jusqu’ici, tout va bien.

J’affiche ensuite le détail d’une acquisition en appuyant dessus :

image

J’arrive à accéder basiquement à mon objet acquisition et à afficher chaque éléments.
Et c’est là que je bloque…

J’aimerais procéder à un formatage de la date, que je récupère via {{ acquisition.date }}.

La date que je récupère est de type String, de ce format : “2020-09-04T01:12:06.000TAI” :

image

La première étape est d’utiliser la fonction slice(), qui permet de récupérer un extrait de ma chaine de caractère afin d’enlever les 3 caractères finaux afin de passer de ceci :
“2020-09-04T01:12:06.000TAI”
à
“2020-09-04T01:12:06.000”

Voici ma method :

image

La deuxième étape est de formater cette string afin de l’afficher selon un format (pour le moment peu importe lequel, un format de type : ‘DD.MM.YYYY, h:mm:ss a’ me conviendra parfaitement.

Pour ceci j’utilise moment et sa fonction format().

J’y arrive parfaitement avec une date test : (dateTest: “2020-09-04T01:12:06.000TAI”)

Cependant lorsque je veux utiliser ces méthodes sur mon {{ acquisition.date }}, je n’y arrive pas.

D’après ce que j’ai compris, et arrêtez moi si je me trompe, le fait d’utiliser une fonction dans une boucle v-for n’est pas vraiment possible.

J’ai donc essayé de modifier l’objet, et plus précisément la date dans ma fonction de récupération de l’acquisition, lorsque je requête l’API comme indiqué plus haut : voir fonction afficherAcquisition(acqId)

J’ai réussi à me débloquer légèrement car j’arrive à faire un slice sur mon acquisition.date dans ma fonction afficherAcquisition(acqId), et ça fonctionne mais je n’arrive toujours pas à utiliser la fonction format.

Je bloque dessus depuis 2 jours, en essayant pas mal de chose, et en regardant énormément de doc mais là je bloque clairement.

Je demande donc votre aide dans l’espoir d’avancer sur mon projet !

Si il manque des extraits de code dîtes le moi, je resterais très à l’affut de vos réponses.

Un grand merci par avance !

En modifiant un peu le code :

J’arrive enfin à afficher ma dateSansTai formatée, mais effectivement, ce n’est pas vraiment comme ça qu’il faut procéder.

Voici l’affichage :

image

Et voici mon message d’erreur sur la console :

image

Ce que je comprend parfaitement, mais je ne saurais le corriger.