vue中v-for循环数字,index从0开始的实现方式

更新时间：2025年04月24日 15:43:49 作者：小泡泡c

这篇文章主要介绍了vue中v-for循环数字,index从0开始的实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

vue中v-for循环数字,index从0开始

1. 循环数字

1）代码

// 写法一
<a-select style="width: 120px">
 <a-select-option :value="index" v-for="index in 14" :key="index"> {{index}}级   </a-select-option>
</a-select>

// 写法二
<a-select style="width: 120px">
 <a-select-option :value="index" v-for="index of 14" :key="index"> {{index}}级   </a-select-option>
</a-select>

2）效果

2. index 从 0开始

1）代码

<a-select style="width: 120px" >
 <a-select-option :value="index" v-for="(n,index) in 14" :key="index"> {{index}}级 </a-select-option>
</a-select>

2）效果

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

Vue.js中的extend绑定节点并显示的方法
在本篇内容里小编给大家整理了关于Vue.js中的extend绑定节点并显示的方法以及相关知识点，需要的朋友们学习下。
2019-06-06
vue element-ui实现input输入框金额数字添加千分位
这篇文章主要介绍了vue element-ui实现input输入框金额数字添加千分位,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
2019-12-12
Vue中Vue.use()的原理及基本使用
相信很多人在用Vue使用别人的组件时,会用到 Vue.use() ,例如：Vue.use(VueRouter)、Vue.use(MintUI),这篇文章主要给大家介绍了关于Vue中Vue.use()的原理及基本使用的相关资料,需要的朋友可以参考下
2021-10-10
Vue3实现高性能虚拟列表的两种方法
在前端开发中,大数据量列表渲染一直是性能挑战,假设我们有一个 API 返回 1 万条数据,如果直接渲染到页面,必然会导致严重卡顿甚至浏览器崩溃,解决方案就是虚拟列表,所以本文给大家介绍了本文两种实现,并给出适用场景,需要的朋友可以参考下
2025-08-08
使用Vue3和Vite实现对低版本浏览器的兼容
在使用Vite和Vue3构建的JavaScript项目中,确保对低版本浏览器的兼容性是一个重要的考虑因素,以下是一些具体的解决方案和步骤,可以帮助你实现这一目标,需要的朋友可以参考下
2024-11-11
vue2中插槽(slot)的基本使用规范
插槽（Slot）是Vue提出来的一个概念,正如名字一样,插槽用于决定将所携带的内容,插入到指定的某个位置,从而使模板分块,具有模块化的特质和更大的重用性,下面这篇文章主要给大家介绍了关于vue2中插槽(slot)的基本使用规范的相关资料,需要的朋友可以参考下
2022-03-03
Vue3+UmiJS项目中实现WebP图片自动转换和优化
WebP 是一种现代图片格式,相比传统的 JPG/PNG 格式,通常可以减少 25-35% 的文件大小,本文将介绍如何在 UmiJS + Vue 3 项目中实现 WebP 图片的自动转换和智能加载,有需要的小伙伴可以了解下
2025-12-12
Vuex模块化和命名空间namespaced实例演示
这篇文章主要介绍了Vuex模块化和命名空间namespaced的相关知识，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2021-11-11
Vue3+Vite4项目进行性能优化的配置方案
这篇文章主要为大家详细介绍了Vue3如何结合Vite4对项目进行性能优化的相关配置,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
2025-04-04
vue中使用file-saver导出文件的全过程记录
这篇文章主要给大家介绍了关于vue中使用file-saver导出文件的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2022-02-02