Bonjour. Cette fois, je voudrais faire la partie fonction de publication de l'application TODO en Java.
Au fait, je n'ai pas abordé la validation cette fois, mais je ne présenterai la méthode que pour le traitement normal car elle apparaîtra dans un article ultérieur.
1: Brève description de MVC 2: Je veux créer un modèle avec Spring Initializr et créer un Hello world 3: Enregistrer les données temporaires dans MySQL-> Tout obtenir-> Afficher en haut 4: Mise en place de la fonction d'affichage (ici et maintenant)
Tout d'abord, je voudrais préparer un conteneur pour les données lorsque l'utilisateur enregistre TODO. Cette fois, je voudrais l'implémenter dans la classe TodoForm.
Je pense que la hiérarchie pour créer des classes devrait être la même que TodoContoroller.
java/com/example/todo/TodoForm.java
@Data
public class TodoForm {
private long Id;
@NotNull
@Size(min = 1, max =30)
private String title;
@DateTimeFormat(pattern = "yyyy-MM-dd")
private LocalDate deadline;
private boolean status;
}
↑ Ça devrait être comme ça.
Il semble que les spécifications aient changé depuis Spring 2.3, vous devez donc l'ajouter manuellement afin d'utiliser des annotations de type validation.
build.gradle
dependencies {
compile group: 'javax.validation', name: 'validation-api', version: '2.0.1.Final'
}
Si vous ajoutez ce qui précède aux dépendances, vous pouvez utiliser @Size et ainsi de suite!
Ensuite, éditez le service.
java/com/example/todo/TodoService.java
@Service
@RequiredArgsConstructor
public class TodoService {
private final TodoRepository todoRepository;
//~ Abréviation ~
public void setTodo(TodoForm formData) {
TodoEntity todo = new TodoEntity();
todo.setTitle(formData.getTitle());
todo.setDeadline(formData.getDeadline());
todoRepository.save(todo);
}
}
Puisque nous ne nous enregistrons que cette fois, la valeur de retour est définie sur void.
Définissez le type de TodoForm formData passé comme argument dans le TodoEntity nouvellement créé et enregistrez-le. Puisque set ~~ et get ~~ sont attachés avec @Data dans chaque classe, LomBok peut créer et utiliser automatiquement des setters et des getters.
Il peut être difficile de comprendre soudainement ce domaine lors de l'utilisation de Lombok, donc si vous voulez comprendre plus profondément, vous devriez étudier le concept de setter getter.
Enfin, enregistrez-le avec la fonction de classe Repository save et enregistrez-le dans la base de données!
Maintenant que la classe Service a été implémentée, appelons-la depuis le contrôleur!
python
@Controller
@RequiredArgsConstructor
public class TodoController {
// ~Abréviation~
@PostMapping("/register")
public String register(@ModelAttribute TodoForm formData) {
todoService.setTodo(formData);
return "redirect:/top";
}
}
Ce à quoi je voudrais faire attention ici, c'est l'annotation @ModelAttribute!
Cette annotation a des usages différents selon qu'elle est utilisée comme argument ou juste avant une méthode!
L'utilisation cette fois-ci est de rendre les données envoyées depuis la face avant dans le type TodoForm afin qu'elles puissent être utilisées dans la fonction.
Veuillez vous référer au site ici pour des explications faciles à comprendre.
Enregistrez TODO dans la base de données en envoyant formData au setTodo créé précédemment.
De plus, lorsque le traitement est terminé, il passera à / top.
Enfin, éditons la face avant!
python
~Abréviation
<body>
<!--Formulaire de publication-->
<div class=" w-75 h-auto my-1 mx-auto pt-5">
<p class="pl-5">Créer une nouvelle tâche</p>
<form th:action="@{/register}" th:object="${ToDoForm}" method="POST" class="container d-flex w-auto my-0 mx-auto">
<div class="w-100">
<label class="row">
<span class="col-2 text-center">Nom de ToDo</span>
<input type="text" name="title" placeholder="Entrez ToDo dans les 30 caractères" class="col-9">
</label>
<label class="row my-0">
<span class="col-2 text-center">Date limite</span>
<input type="date" id="date" name="deadline" class="col-9 my-0">
</label>
</div>
<button class="btn btn-primary w-25 col-2 mr-3" type="submit">Ajouter ToDo</button>
</form>
</div>
</body>
Le contenu enregistré est passé à la fonction du contrôleur mappé à / register dans th: action.
De plus, puisque method = "POST", des spécifications détaillées telles que les fonctions POST et / register sont spécifiées.
Cette idée est très importante pour comprendre la nature des méthodes HTTP, vous pouvez donc vous référer au site here.
th: object est utilisé pour spécifier le conteneur des données transmises.
Les données soumises sont insérées dans l'objet TodoForm créé au tout début de cet article.
Lorsque le bouton d'enregistrement est enfoncé
<input type="text" name="title" placeholder="Entrez ToDo dans les 30 caractères" class="col-9">
Le contenu saisi dans name = "title" est stocké dans la variable avec le même nom (bien sûr, title) de la classe FormData.
Comment était-ce? Pour résumer brièvement ...
C'est comme ça!
Je pense que vous pourriez progressivement comprendre le flux de MVC.
La prochaine fois, j'aimerais toucher la page d'édition. À la prochaine!
Recommended Posts