鍍金池/ 問(wèn)答/HTML/ v-bind中為什么key和id都可以？

v-bind中為什么key和id都可以？

<template>
  <div id="todolist">
    <ul>
      <li v-for="todo in todos">
        <todo v-bind:todo="todo"
              v-bind:id="todo.id">  //這里也可以是v-bind:key="todo.id"
        </todo>
      </li>
    </ul>
  </div>
</template>

<script>
  import Todo from './Todo.vue'

  export default {
    components: {
      Todo
    },
    data: function () {
      return {
        todos: [
          { text: 'Learn Vue' },
          { text: 'Do hard things' }
        ]
      }
    }
  }
</script>

這段代碼中為什么v-bind:id也可以改成v-bind:key?

回答
編輯回答
病癮

v-bind:id綁定的是html的屬性
v-bind:key看這里

2017年7月22日 13:03
編輯回答
撿肥皂

什么叫為什么都可以 自定義屬性 可以v-bind綁定啊 難道這個(gè)有問(wèn)題么 只不過(guò)你換個(gè)屬性 獲取改變的時(shí)候獲取你所定義的屬性就好

2017年11月2日 09:55
編輯回答
念初

你不會(huì)想說(shuō) 兩種寫法在子組件都可以接收到數(shù)據(jù)吧，我沒(méi)試過(guò)，理論上應(yīng)該不會(huì)吧。還有記得一些html的保留字最好不要用作props。

2017年4月10日 16:47
編輯回答
不舍棄

這好比一個(gè)元素既有id又有class，你可以通過(guò)id或者class取到這個(gè)元素，他們之間是有聯(lián)系，但是功能和表達(dá)的含義還是有些許不同的

2017年6月18日 14:39
編輯回答
半心人

首先你得理解v-bind的含義，是vue的一個(gè)用于綁定html屬性的指令，可以綁定已有屬性，也可以綁定自定義屬性，v-bind:id即表示綁定已有屬性id，v-bind:key是為了在v-for循環(huán)中給 Vue 一個(gè)提示，以便它能跟蹤每個(gè)節(jié)點(diǎn)的身份，從而重用和重新排序現(xiàn)有元素，你需要為每項(xiàng)提供一個(gè)唯一 key 屬性。
當(dāng)然你也可以用于綁定自定義屬性，如給每項(xiàng)增加一個(gè)tid，v-bind:tid。

2017年8月29日 21:06