• v-for中:key的作用总结


    当Vue用 v-for 正在更新已渲染过的元素列表是,它默认用“就地复用”策略。如果数据项的顺序被改变,Vue将不是移动DOM元素来匹配数据项的改变,而是简单复用此处每个元素,并且确保它在特定索引下显示已被渲染过的每个元素。

    为了给Vue一个提示,以便它能跟踪每个节点的身份,从而重用和重新排序现有元素,你需要为每项提供一个唯一 key 属性。key属性的类型只能为 string或者number类型。

    示例

    <!--注意:v-for循环的时候,key属性只能使用numberstring -->

    <!--注意:key使用的时候,必须使用v-bind绑定属性的形式,指定key的值 -->

    <!-- 在组件中,使用 v-for循环的时候,或者在一些特殊情况中,如果v-for有问题必须在使用v-for的同时,指定唯一的 字符串/数字 类型:key 值-->
    <p v-for="item in list" :key="item.id">
    
       <input type="checkbox"/>
    
       {{item.id}}--{{item.name}}
    
    </p>

    总结

    key的作用主要是为了高效的更新虚拟DOM!!!

       
  • 相关阅读:
    Qt之根据扩展名获取文件图标、类型
    C++根据扩展名获取文件图标、类型
    Qt之QFileIconProvider(根据扩展名获取文件图标、类型)
    Qt之QTemporaryFile
    Qt之QFileIconProvider
    Qt之字典划词
    Qt之滚动字幕
    Qt之QThread
    Python 安装 httplib2
    Qt之QTimer
  • 原文地址:https://www.cnblogs.com/Ky-Thompson23/p/12358185.html
Copyright © 2020-2023  润新知