Блог

Главная - Вопросы по программированию - как проверить, является ли элемент объекта пустым

как проверить, является ли элемент объекта пустым

#vue.js

#vue.js

Вопрос:

У меня есть форма vue, и я пытаюсь собрать данные в объект, но когда один элемент объекта пуст, я хочу, чтобы это поле было уничтожено.

это мое поле ввода:

  <input v-model="fields.title" >

мои данные:

  data() {
        return {
            fields: {},
        }
    },

По сути, прямо сейчас происходит то, что происходит, когда я что-то пишу в своем поле, оно создается title: 'data' , и если я удаляю текст внутри, то этот элемент все еще существует там, поэтому я остаюсь title: '' , но я хочу, чтобы он был удален, если он пустой.

Я могу воссоздать это следующим образом:

 computed: {
       destroyFieldWhenEmpty() {
           if (this.fields.title === ''){
               this.$delete(this.fields, 'title')
           }

Но теперь, если у меня много полей, я должен переписать этот оператор if для каждого ввода.

Таким образом, как я мог бы сделать это лучше?

Комментарии:

1. зачем вы это делаете? каков конкретный вариант использования?

2. destroyFieldWhenEmpty это неправильное использование вычисляемых реквизитов, поскольку он, по-видимому, используется только для удаления fields.title , но вычисляемые реквизиты должны возвращать что-то (для использования в другом месте компонента) и не должны иметь побочных эффектов.

3. @BoussadjraBrahim Итак, в принципе, я хочу изменить класс одного из моих div, когда данные вставляются в любое из полей, для этого мне нужно проверить, является ли объект fields пустым, и изменить класс на основе этого.

4. не могли бы вы показать, как вы это делаете?

Ответ №1:

— Используйте функцию Lodash isEmpty()

 _.isEmpty({}) // true
_.isEmpty({title: 'title'}) // false

— Используйте Object.keys().length

 const obj = {...}

Если obj пусто, Object.keys(obj).length равно 0.

Ответ №2:

Пока что я понял вашу проблему: вы пытаетесь удалить объект из массива. если это так, вы можете фильтровать данные с помощью своей собственной бизнес-логики следующим образом

 const restFields = this.fields.filter(field => field.title.length > 0)

Комментарии:

1. fields это объект, а не массив.

2. @tony19 ты, ты пытался добавить v-if="fields.title" , чтобы скрыть какой-либо компонент vue. или, если вы хотите удалить ключ из объекта, попробуйте delete this.fields.title . На самом деле слишком много способов сделать это, но неясно, какова ваша логика.

Метки: