Vue js change array index position by Up and Down click

<html>
<head>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
    <h3>Vue js change array index position by Up and Down click </h3>
    <div id="app">
        <ul>
            <li v-for="(item, index) in items" :key="index">
                {{ item }}
                <button @click="moveUp(index)" :disabled="index === 0">Up</button>
                <button @click="moveDown(index)" :disabled="index === items.length - 1">Down</button>
            </li>
        </ul>
    </div>
    <script type="module">
        const app = new Vue({
            el: "#app",
            data: {
                items: ['Vue', 'React', 'Nuxt', 'PHP','Node']
            },
            methods: {
                moveUp(index) {
                    const temp = this.items[index]
                    this.items.splice(index, 1)
                    this.items.splice(index - 1, 0, temp)
                },
                moveDown(index) {
                    const temp = this.items[index]
                    this.items.splice(index, 1)
                    this.items.splice(index + 1, 0, temp)
                }
            }
        });
    </script>
    <style scoped>
        ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }

li {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 10px;
            background-color: #f8f8f8;
            border-radius: 5px;
            margin-bottom: 10px;
        }

button {
            background-color: #4CAF50;
            color: white;
            border: none;
            padding: 8px 16px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin-left: 10px;
            border-radius: 5px;
            cursor: pointer;
        }

button:disabled {
            background-color: #bfbfbf;
            cursor: default;
        }

button:hover:not(:disabled) {
            background-color: #3e8e41;
        }
    </style>
 </body>
</html>