Open
Description
NutUI scenes(nutui 场景)
小程序(@nutui/nutui-taro)
NutUI-vue version(nutui-vue 版本)
4.0.5
Vue version(vue 版本)
3.2.47
Operating environment(运行环境)
dev:weapp
Citation method(引用方式)
npm
Node version(node 版本)
19.7.0
Browser and its version(浏览器及其版本)
System and its version(系统及其版本)
windows10
Taro environmental information(taro 环境信息)
Taro CLI 3.6.2 environment info:
System:
OS: Windows 10
Binaries:
Node: 19.7.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.19 - C:\Users\ttav\AppData\Roaming\npm\yarn.CMD
npm: 9.2.0 - C:\Program Files\nodejs\npm.CMD
Reproduction link(重现链接)
Steps to reproduce(重现步骤)
拿官网文档的代码小改了下直接放上去了,对数组的增改不会触发列表的刷新,像是丢失了响应式,打印了下实际上响应式没丢。
尝试过用ref代替,结果一样,如果用普通的列表<li>
进行数据绑定,效果是正常的。再吐槽下这个组件,真的难用,至少在小程序上是这样的,原版代码测试列表的显示都不正常,看了下已经有几个人开了issue了所以就不再开了。
Markdown不会用 见谅 下面是部分重点代码
<nut-cell>
<nut-list
:height="50"
:listData="state.count">
<template v-slot="{ item, index }">
<div class="list-item" @click="edit(index)">
{{ index }}
</div>
</template>
</nut-list>
</nut-cell>
<script setup>
import { onMounted, reactive } from "vue";
const state = reactive({
count: new Array(10).fill(0),
});
const edit = (index) => {
state.count.splice(index, 1);
};
onMounted(() => {
state.count = state.count.map((item, index) => index + 1);
});
</script>
What is expected?(期望的结果是什么?)
正常增改,页面同步渲染。
What is actually happening?(实际的结果是什么?)
列表没有刷新