Vue Js Break foreach loop

<html>

<body>
    <h3>Vue Js Break foreach loop</h3>
    <div id="app">
        <table>
            <tr>
                <th>S.no</th>
                <th>Name</th>
                <th>Salary</th>
            </tr>

<tbody v-for="(item, index) in items" v-if="index < 5" :key="index">
                <tr>
                    <td>{{index}}</td>
                    <td> {{ item.name }}</td>
                    <td> {{item.salary}}</td>
                </tr>

</tbody>
        </table>

</div>
    <script type="module">
        const app = new Vue({
            el: "#app",
            data() {
                return {
                    items: [
                        { name: "John Doe", salary: 50000 },
                        { name: "Jane Doe", salary: 55000 },
                        { name: "Michael Johnson", salary: 65000 },
                        { name: "David Brown", salary: 45000 },
                        { name: "Sarah Miller", salary: 55000 },
                        { name: "Chris Davis", salary: 52000 },
                        { name: "Jessica Wilson", salary: 60000 },
                        { name: "Brian Anderson", salary: 56000 },
                        { name: "Lauren Taylor", salary: 67000 },
                        { name: "Kevin Chen", salary: 71000 },
                        { name: "Emily Davis", salary: 68000 },
                        { name: "Andrew Martinez", salary: 69000 },
                        { name: "Rachel Lee", salary: 61000 },
                        { name: "Thomas Smith", salary: 50000 },
                        { name: "Elizabeth Wilson", salary: 63000 }
                    ]

};
            },
        })
    </script>

</body>

</html>