Использование Vue для фильтрации объектов DOM - PullRequest
1 голос
/ 24 сентября 2019

У меня есть список элементов, которые отображаются на сервере Django.Их с языком шаблонов Django для отображения списка.Список - это список объектов dom.

Для этого элемента в списке у меня есть два атрибута данных, которые являются текстовыми строками.Я хочу использовать Vue для фильтрации списка на основе этих атрибутов.Я использовал v-if для отображения элементов на основе того, что было выбрано из двух списков, которые содержали сопоставление переменных данных с атрибутами данных.

Проблема, с которой я столкнулся, заключается в том, что я могу толькополучить фильтр из двух частей.Таким образом, я могу заставить это работать, только если отфильтрую сначала одну вещь, а затем другую.Я хочу отфильтровать список по тому, какой выпадающий список был выбран первым, а затем уточнен по второму.

Итак, мой вопрос, должен ли я воссоздать список в компонентах Vue Data, а затем отфильтровать их илия думаю о v-if неправильно?

Здесь 'мой объект dom с v-if:

<div class="page" data-example-1="{{ product.value.example-1 }}" data-example-2="{{ product.value.example-2 }}" v-if="example-1 === '{{ product.value.example-1 }}' && example-2 === '{{ product.value.example-2 }}'">
  <h3 class="is-title is-3">{{ product.value.title }}</h3>
  <p class="is-size-7">Loc: <strong>{{ product.value.example-1|title }}</strong> | Lang: <strong>{{ product.value.example-2|title }}</strong></p>
</div>

Я понимаю, что сейчас я использую оператор &&,но я не уверен, как еще думать об этом.Как видите, data-example-1 и data-example-2 в данный момент не используются.

Предложения приветствуются.

...