@w1kenD

Проблема реализации всплывающего placeholder'a в поле input во Vue.js?

С Vue.js начал работать недавно и столкнулся проблемой реализации всплывающего placeholder'a в поле input. Нашёл пример реализации, и уже несколько дней ломаю голову как это перенести на Vue.

Пример - jsfiddle.net/ms8Ldqv3

HTML код компонента Vue
<form class="login" @submit.prevent="loginUp">
      <h1 class="header">Войти</h1>

      <form class="login-form">
        <div class="cool-input">
          <input
            class="login-input"
            required
            v-model.trim="$v.userName.$model"
            :class="{
              invalid:
                ($v.userName.$dirty && !$v.userName.required) ||
                ($v.userName.$dirty && !$v.userName.maxLength),
              error:
                ($v.userName.$dirty && !$v.userName.required) ||
                ($v.userName.$dirty && !$v.userName.maxLength),
            }"
          />
          <span
            v-bind:class="[usernamePushUp]"
            v-on:click="span"
            class="cool-input__placeholder"
            >Логин</span
          >
<form/>


А вот как переписать код JS + jQuery на Vue, чтобы плейсхолдер оставался вверху, если что-то введено не знаю. Помогите пожалуйста!
  • Вопрос задан
  • 63 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы