在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ v-for如何設(shè)置步長呢??

v-for如何設(shè)置步長呢??

v-for

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Vue-For</title>
<meta name="description" content="">
<meta name="keywords" content="">
<script type="text/javascript" src="https://cdn.bootcss.com/vue/2.5.13/vue.min.js"></script>
</head>
<body>
    <div>
        <ul id="example-2">
          <li v-for="(item, index) in items">
            {{ parentMessage }} - {{ index }} - {{ item.message }}
          </li>
        </ul>
    </div>

    <script type="text/javascript">
        var example2 = new Vue({
          el: '#example-2',
          data: {
            parentMessage: 'Parent',
            items: [
              { message: 'Foo' },
              { message: 'Bar' },
              { message: 'meng' },
              { message: 'hang' },
              { message: 'game' },
            ]
          }
        })
    </script>
</body>
</html>

問題

如何讓v-for的時(shí)候,index += 2,文檔里未發(fā)現(xiàn),或者說我這樣的想法可以變通??

回答
編輯回答
冷眸

思考

這個(gè)問題不應(yīng)該在渲染的時(shí)候去解決,應(yīng)該對(duì)數(shù)據(jù)重組

例子

function getData(list) {
    var res = [];
    var count = 0;
    for (var i = 0; i < list.length; i++) {
        var item = list[i];
        if (i % 2 === 1) {
            res[count].push(item);
            count++;
        } else {
            res.push([]);
            res[count].push(item);
        }
    }
    return res;
}
2018年7月15日 22:25
編輯回答
獨(dú)白

僅修改了div那部分,復(fù)制替換便可看到效果,希望能幫助到你:

<div>
    <ul id="example-2">
        <li v-for="(item, index) in items" v-if="index%2 === 0">
            {{ parentMessage }} - {{ index }} - {{ item.message }} -奇數(shù)條數(shù)據(jù)-
            <span v-if="items[index + 1] != undefined">{{ parentMessage }} - {{ index + 1 }} - {{ items[index + 1].message }}</span>
        </li>
    </ul>
</div>
2018年8月24日 16:54
編輯回答
執(zhí)念

我覺得可以用這種方法:
https://vuejs.org/v2/guide/li...

v-for="(item, index) in even(items)"

methods: {
    even(){} // 返回 index + 2的元素
}
2017年5月27日 20:39
編輯回答
葬憶

每個(gè)items加個(gè)flag也可以實(shí)現(xiàn)...

額....v-for又沒有回調(diào)函數(shù),只能在數(shù)據(jù)里做判斷,加個(gè)flag判斷那個(gè)值要不要沒什么錯(cuò)的啊...
特殊需求可以自己寫個(gè)directives 來實(shí)現(xiàn),不用v-for,或者reder也行....

2017年1月23日 02:31