carousel BUG!!!渲染问题
onlyCK opened this issue · comments
Describe the bug
轮播卡片自定义,卡片通过for循环遍历渲染,并且数组元素数据和渲染视图同步更新,在carousel内第一个卡片无法更新视图,而后面的卡片都可以更新,触发条件是点击卡片更新元素的字段。
Steps to reproduce
第一个卡片无法更新
const activityData = ref([])
<n-carousel draggable style="padding: 8vw 0 0" :on-update:current-index="handleCurrentIndexUpdate">
<div class="activity-item1" v-for="(item, index) in activityData" :key="'activity' + index">
<activity :data="item.data" :bg="item.bg" @change="changeHandle" />
</div>
</n-carousel>
Link to minimal reproduction
https://www.naiveui.com/zh-CN/light/components/carousel
System Info
Apple M1
13.2.1 (22D68)
"naive-ui": "^2.35.0",
Used Package Manager
pnpm
Validations
- Read the Contributing Guidelines.
- Read the docs.
- Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- Check that this is a concrete bug. For Q&A open a GitHub Discussion.
- The provided reproduction is a minimal reproducible example of the bug.
子组件<n-config-provider class="bg" :theme="darkTheme"> <div class="main"> <template v-for="(item, index) in data" :key="index"> <div class="num">{{ item.num }}</div> </template> </div> </n-config-provider>
问题代码 <n-carousel draggable :on-update:current-index="handleCurrentIndexUpdate"> <div class="item" v-for="(item, index) in dataArr" :key="'index"> <children :data="item.data" @change="changeHandle" /> </div> </n-carousel>
更改dataArr的值 ,第一个组件的视图不会更新