Vueリストレンダリングキーの原理と機能の詳細な説明

    <div id="ルート">
        <button @click.once="add">ラオ・リューを追加</button>
        <ul>
            <li v-for="(p, index) 人" :key="index">
                {{p.name}}---{{p.age}}
                <入力タイプ="テキスト">
            </li>
        </ul>
    </div>

        var vm = 新しい Vue({
            el:"#ルート",
            データ：{
                人数:
                    {id:"001", 名前:"张三", 年齢:15},
                    {id:"002", 名前:"李思", 年齢:16},
                    {id:"003", 名前:"王五", 年齢:17}
                ]
            },
            メソッド: {
                追加（）{
                    const p = {id:"004", name:"老刘", age:20}
                    this.persons.unshift(p)
                }
            },
        })