翻译表述有误

[xtyuns]

翻译表述有误

[Justineo]

原文所表达的意思应该是：当那些使用 key 的元素不再出现时将会被移除/销毁。

原翻译表达的确是有点歧义，但不是这样的。应该这样说：

那些使用了已经不存在的 key 的元素将会被移除/销毁。

[xtyuns]

但是我通过以下案例测试了删除key对元素的影响，但是它并没有产生销毁元素的效果
(我不确定该案例是否能说明这个问题)

    <div id="app"></div>

    <script src="https://cdn.bootcdn.net/ajax/libs/vue/3.1.5/vue.global.min.js"></script>
    <script>
        Vue.createApp({
            setup: function() {
                const store =  Vue.reactive([
                    {id:0, v:0},
                    {id:1, v:1},
                    {id:2, v:2}
                ])

                Vue.onMounted(() => {
                    console.log('onMounted', Vue.toRaw(store))
                })
                
                const removeId = () => {
                    store.forEach(item => delete item.id)
                    console.log('delete id', Vue.toRaw(store))
                }

                return {store, removeId}
            },
            render() {
                return Vue.h('div', {}, [
                    Vue.h('ul', {}, this.store.map(item => Vue.h('li', { key: item.id }, item.v))),
                    Vue.h('button', { onClick: this.removeId }, 'remove Key')
                ])
            }
        }).mount('#app')
    </script>

[xtyuns]

那些使用了已经不存在的 key 的元素将会被移除/销毁。

这个翻译确实是正确的，是我之前的理解有误

但是关于上面的那个案例，这的确使我不太能够理解，也有可能是我没有真正理解文档中所表述的概念。

[Yukon123]

@xtyuns 因为 key的赋值过程是值传递,而不是引用传递.所以删除 item.id 并不会影响到 key.
这也就是为什么vue推荐用 string | number类型来作为key的值

Don't use non-primitive values like objects and arrays as v-for keys. Use string or numeric values instead.
https://v3.vuejs.org/guide/list.html#maintaining-state

如果想做测试用例的话,应该是通过ref引用直接操作dom元素修改成新的不存在的key值
(这个列表的元素都有key值,我不确定创建一个没有key值的元素会不会被复用之前的元素,感觉最好是修改成新的key值)

[xtyuns]

1. 关于翻译的表述已经达成了一致。
2. 关于 key 的使用问题我将私下再参考其他实例看一下。

稍后我将提交 PR 来关闭此 Issue。