Vue фильтры для ввода / V-модель - PullRequest
Новая
       21

Vue фильтры для ввода / V-модель

0 голосов
/ 18 февраля 2019

Итак, я новичок в ES6 SPA Javascript и Vue JS.Я в основном использовал JQuery.

Итак, у меня есть глобальный фильтр, 

Vue.filter('formatDate', function (value) {
  if (value) {
    return moment(String(value)).format('Do MMMM YYYY')
  }
})

Я также использую Vuetify.Я могу использовать этот фильтр с таблицей данных, например, 

{{ props.item.DateAdded | formatDate }}

Однако, он не работает для меня на v-model, я догадываюсь, что я делаю что-то не так? 

 <v-flex xs12><v-text-field v-model="profileData.DateAdded | formatDate" label="Date Added"></v-text-field></v-flex>

Я также пробовал, v-bind:value в качестве входного значения, которое я хочу отформатировать?Не повезло.

Пожалуйста, помогите?

Спасибо,

1 Ответ

0 голосов
/ 18 февраля 2019

Согласно documentmentaiton :

Фильтры можно использовать в двух местах: интерполяция усов и выражения v-bind (последнее поддерживается в 2.1.0 +)

Так что вы можете использовать v-bind.Вы сказали, что пытались, но это не работает, но работает в этом jsfiddle .Я также добавил обработчик событий @input, чтобы иметь функциональность v-model.

Таким образом, в основном ваш компонент текстового поля должен выглядеть следующим образом: 

<v-text-field
  :value="profileData.DateAdded | formatDate"
  label="Date Added"
  @input="value => profileData.DateAdded = value"
></v-text-field>
...