antd vue 折叠面板 v-for 循环点击无效
2022/6/29 23:21:35
本文主要是介绍antd vue 折叠面板 v-for 循环点击无效,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
问题描述
实现一个折叠面板点击展开,但是必须点击两次才能展开,第一次无效
<a-collapse-panel v-for="(item, index) in dataMap" :key="index" :show-arrow="false" > <p>{{ text }}</p> <template slot="header"> {{ item.name }}</template> <template slot="extra"> 数据</template> </a-collapse-panel>
解决方案
查看文档,对于key值要求是String,但是循环的index默认是Number!
更改写法,问题解决
<a-collapse-panel v-for="(item, i) in details" :key="`${i}`"> </a-collapse-panel> // 或 <a-collapse-panel v-for="(item, i) in details" :key="i.toString()`"> </a-collapse-panel>
这篇关于antd vue 折叠面板 v-for 循环点击无效的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-03-30[OIDC in Action] 2. 基于OIDC(OpenID Connect)的SSO(纯JS客户端)
- 2024-03-29terraform jsonencode
- 2024-03-13vuex-persist
- 2024-03-11icons for vue
- 2024-03-07breadcrumbs react js
- 2024-03-06react login page example
- 2024-03-06react router uselocation
- 2024-03-04postgres jsonb_set
- 2024-03-01react native uuid
- 2024-02-29vuejs sidebar