Maison  >  Questions et réponses  >  le corps du texte

javascript - Comment implémenter le tri v-for="n in 10", la valeur par défaut est de 1 à 10, comment implémenter le tri de 10 à 1 ?

v-for="n in 10" Comment implémenter le tri ? La valeur par défaut est de 1 à 10. Comment implémenter de 10 à 1 ?

習慣沉默習慣沉默2711 Il y a quelques jours673

répondre à tous(7)je répondrai

  • 滿天的星座

    滿天的星座2017-05-19 10:27:39

    Si tu veux passer de 10 à 1, ne suffirait-il pas de 11 - n...
    Pourquoi es-tu si droit...

    répondre
    0
  • 巴扎黑

    巴扎黑2017-05-19 10:27:39

    Le questionneur n'a pas écrit la balise vue, mais j'ai vu l'instruction v-for. Le questionneur devrait demander comment utiliser vue pour organiser 1 à 10 dans l'ordre inverse.
    Supposons qu'il existe le composant vue suivant


          var vm = new Vue({
                el: '#app',
                template: `
                        <ul>
                        <li v-for="item in arr">loop {{item}}</li>
                        </ul>
                       
                       `,
                
                filters: {
                    
                },
                data() {
                    return {
                        arr:10,
            
                    }
            
                },
            
            })
            
            

    1.Utiliser le filtre

    filters: {
            sort(v) {
                if (!v)
                    return ''
                else {
                    return 11 - v
                }
            },
            template:`<ul><li v-for="item in arr">{{item|sort}}</li></ul>`

    2.Utilisation de la méthode vue

     template: `
                <ul>
                <li v-for="item in arr">{{reverseNumber(item)}}</li>
                </ul>
               
               `,
                methods: {
            reverseNumber(x) {
                return 11 - x
            },
            }

    Il n'y a aucun moyen d'utiliser des attributs calculés pour parcourir un nombre comme celui-ci. Les attributs calculés se produisent lorsqu'une valeur dans data est modifiée, et son mappage à une autre valeur équivaut à une fonction, et >v-for Il parcourt les données de la liste, ce qui équivaut à un itérateur, et ne modifie pas une certaine valeur d'attribut des données. data中一个值改变后,把他映射到另外一个值相当于一个函数,而v-for是循环了列表的数据相当于一个迭代器,并没有改变数据data的某个属性值。


    建议你循环一个数组或对象,不要直接循环数字。除非逻辑真的很简单,就是循环生成几个标签。把一个数组元素排序你还可以采用,sort()传入倒序排序函数,这样就可以用计算属性,先映射排序数组到计算属性,然后v-for

    Il est recommandé de boucler un tableau ou un objet au lieu de boucler directement des nombres🎜. À moins que la logique ne soit vraiment simple, elle génère simplement plusieurs balises en boucle. Pour trier un élément du tableau, vous pouvez également utiliser sort() pour transmettre la fonction d'ordre inverse, afin de pouvoir utiliser l'attribut calculé. Mappez d'abord le tableau trié à l'attribut calculé, puis v-for boucle le calcul de la propriété d'ordre inverse. L'ordre inverse peut également être mis en œuvre. 🎜 🎜Dans les cas simples, je recommande d'utiliser des filtres, qui sont des pipelines angulaires🎜

    répondre
    0
  • 给我你的怀抱

    给我你的怀抱2017-05-19 10:27:39

    Ensuite, vous devez créer un tableau pour stocker 10~1

    répondre
    0
  • 滿天的星座

    滿天的星座2017-05-19 10:27:39

    Vous pouvez utiliser des attributs calculés. Pour plus de détails, voir [Portal] dans la méthode de tri js. Si vous ne comprenez pas le tri, voir

    .

    【Ici】

    répondre
    0
  • PHP中文网

    PHP中文网2017-05-19 10:27:39

    S'il est en vue, vous pouvez également envisager d'utiliser des filtres pour convertir

    répondre
    0
  • 仅有的幸福

    仅有的幸福2017-05-19 10:27:39

    <select>
        <option v-for="n in 21" :value="22-n">{{22-n}}</option>
    </select>
    
    <select>
        <option v-for="n in 21" :id="22-n">{{22-n}}</option>
    </select>
    这两段,为什么上面这个value值就没有用,而id就可以呢?

    répondre
    0
  • 高洛峰

    高洛峰2017-05-19 10:27:39

    3 méthodes : 1. Utiliser le filtre 2. Calculer les attributs 3. Événement de méthodes Le traitement de l'événement 11-n est relativement simple

    répondre
    0
  • Annulerrépondre