Javascript 如何在vue.js 2上循环模板标记？

我的代码如下：

<template>
    <nav aria-label="Page navigation">
        <ul class="pagination">
            <li>
                <a href="#" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                </a>
            </li>
            @for(i=0;i<total;i++)
            <li><a href="#">{{i}}</a></li>
            @endfor
            <li>
                <a href="#" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a>
            </li>
        </ul>
    </nav>
</template>
<script>
    export default{
        props:['total', 'data'],
        created: function(){
            console.log(this.$store.state.product.next_page);
        },
        computed:{
            next:function(){
                return this.$store.state.product.next_page
            }
        }
    }
</script>

<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>

@对于（i=0；iFrom

使用

@moses dude，只要问你的问题，让别人回答就行了。如果我打扰了你，我很抱歉
<li v-for="i in total">
  <a href="#">{{i}}</a>
</li>

<component-name total="5"...

<component-name :total="5" ...