Я могу использовать аргумент 'индекс' в 'в-в' вложенные в "метод"?


Я могу использовать аргумент 'индекс' в 'в-в' вложенные в "метод"?

24.12.2019 10:57:29 Просмотров 80 Источник

Мне нужно использовать индекс на v-for, но на том же уровне, directiveпоказываемое состояние.

mutate

Я хочу ограничить то, что отображается в этой итерации, поэтому я показываю только содержимое с <template> <div> <div v-for="share in sharesPurchased()" :key="share"> <div> <h4>This is some content</h4> <p style="border: solid 1px">{{share.count}}</p> </div> </div> </div> </template> <script> export default { data(){ return { shares: [ {id: 'BMW', count: 1}, {id: 'Ford', count: 0}, {id:'Apple', count: 10} ] } }, methods: { sharesPurchased() { // I want to use this at the v-for level to limit content view } } } </script> i.e: count > 0

Результат моего намерения, как указано выше, должен иметь shares[i].count > 0отображение только <p style="border: solid 1px">{{share.count}}</p>Как только 1 является this.shares[0].count тогда >

У вопроса есть решение - Посмотреть?

Ответы - Я могу использовать аргумент 'индекс' в 'в-в' вложенные в "метод"? / Can I use the 'index' argument in 'v-for' nested in a 'method'?

Является ответом!
Terry

24.12.2019 11:00:04

Обновление: основываясь на вашей потребности использовать его, это явно проблема X-Y. Вместо этого вы должны использовать вычисляемые свойства:

computed: {
    filteredSharesByCount: function() {
        return this.shares.filter(share => share.count > 0);
    }
}

Затем вы можете ссылаться на него как на таковой в своем шаблоне:


Устаревший ответ:

Индекс доступен в качестве второго необязательного аргумента в v-for:

v-forтакже поддерживает необязательный второй аргумент для индекса текущего элемента.

т.е.:

<div v-for="(share, idx) in sharesPurchased(shares)" :key="share">

Затем в цикле вы можете просто использовать idx, если хотите, чтобы метод имел доступ к индексу.

https://stackoverflow.com/questions/59472978/can-i-use-the-index-argument-in-v-for-nested-in-a-method/59472999#comment105124417_59472999
Да, я понимаю, что он есть, но когда я попытаюсь использовать его в рамках methodeslint, он скажет мне, что idxбыл определен, но никогда не использовался...
https://stackoverflow.com/questions/59472978/can-i-use-the-index-argument-in-v-for-nested-in-a-method/59472999#comment105124423_59472999
Попробуйте :index="idx", или v-index, я забыл какой. Отредактируйте или, если вы не используете его вообще, попробуйте удалить его из ()
https://stackoverflow.com/questions/59472978/can-i-use-the-index-argument-in-v-for-nested-in-a-method/59472999#comment105124446_59472999
Сначала нужно передать методу индекс. В вашем коде нет никаких указаний на то, где вы планируете его использовать, поэтому неясно, каков ваш предполагаемый вариант использования.
https://stackoverflow.com/questions/59472978/can-i-use-the-index-argument-in-v-for-nested-in-a-method/59472999#comment105124563_59472999
Вместо того, чтобы показывать все содержимое, я хочу ограничить содержимое любым общим ресурсом, который имеет количество выше 0, вместо того, чтобы отображать его все как на обычном v-for=share in shares. Я удалю filtersтам для того чтобы попытаться быть более ясным в своих намерениях
https://stackoverflow.com/questions/59472978/can-i-use-the-index-argument-in-v-for-nested-in-a-method/59472999#comment105124871_59472999
Спасибо, Терри. Я понимаю, что вы делаете в этой computedfunction, но я все еще кажусь смущенным. Теперь я должен использовать эту computedфункцию в элементе div Это не работа и что ты предлагаешь, чтобы быть возвращены + арг передается @ <div v-for="share in filteredSharesByCount()" :key="share"> в этом случае?
https://stackoverflow.com/questions/59472978/can-i-use-the-index-argument-in-v-for-nested-in-a-method/59472999#comment105125053_59472999
Смотрите мой обновленный ответ: вы должны фильтровать на основе this.shares. И да, вы используете вычисляемое свойство для v-for
https://stackoverflow.com/questions/59472978/can-i-use-the-index-argument-in-v-for-nested-in-a-method/59472999#comment105125210_59472999
Спасибо! Я совершил глупую ошибку, введя computedметод с пустым ()помимо него. А теперь я его получил! Большое спасибо за ваше терпение! Ваше здоровье!
Помочь в развитии проекта:
Закрыть X