만약 v-for에서 키 속성을 연결하지 않는다면 어떻게 될까요?

다음 코드로 주석한 부분
키 = "hoge"바인딩이 왜 필요한지 조사했습니다.
그나저나 없어도 될 것 같아?

        <table class="table table-bordered text-center">
            <thead  class="thead-dark">
                <tr>
                    <th>No.</th>
                    <th>項目</th>
                    <th>入力欄</th>
                </tr>
            </thead>
            <tbody>
                <tr v-for="profile in profiles" :key="profile.id">  //←このkey要る??
                    <td>{{ profile.id }}</td>
                    <td>{{ profile.question }}</td>
                    <td><input type="text">  
                    <button class="btn btn-danger" @click="deleteRow(index)">項目削除</td>
                </tr>
            </tbody>

결론

키를 연결하지 않는 경우 input 탭과 삭제 처리가 조합되면 무의식적인 행동이 됩니다.
어떤 움직임이 있을지.
예를 들어 데이트 앱이 있는 로그인 화면(천나미는 해본 적이 없다)을 가정한다.

그래, 입력이 끝났어.
아, 근데 출신 노출 하기 싫으니까 프로젝트 다 지워.

누르면 이렇게 ↓

한마디로 자신을 표현하는 말이 바로 "Bon cubon"이다...!!
아, 끝났어...라는 뜻이다.
삭제 처리가 끝난 후 다시 렌더링할 때: 키 속성을 유일한 값으로 설정하지 않으면
Vue는 가장 저렴한 방법으로 다시 그리려고 하지만 input 요소는 삭제되지 않습니다.속도를 추구하면 이상하게 느껴질 거야.
Vue.왜냐하면 js의 공식도 이렇게 말하기 때문이다. 솔직히 키 속성을 달아라.
https://jp.vuejs.org/v2/guide/list.html#%E3%82%B3%E3%83%B3%E3%83%9D%E3%83%BC%E3%83%8D%E3%83%B3%E3%83%88%E3%81%A8-v-for