Урок 10 · Vue

Отдельный ref для удачного результата

После сохранения человек должен увидеть подтверждение, и оно не смешивается с текстом ошибки.

Почему это следующий шаг

Поле уже связано с данными. Осталось сказать, что действие получилось.

Как сделать

Заведи message. При успешном действии запиши в него фразу и очисти error. При ошибке сделай наоборот. В шаблоне покажи непустой message через v-if. Не используй одно и то же поле и для ошибки, и для успеха: их легко перепутать цветом. Следующий шаг курса уже в WordPress: там сообщения о публикации показывает сам редактор.

message.value = "Сохранено";
error.value = "";

Что проверить

• Успех и ошибка не видны вместе.
• Новое действие заменяет старое сообщение.
• Пустое сообщение не занимает экран.