vue是組件化開發的項目，很多情況下會把公共組件提取出來，來減少代碼量，提高開發效率，和以后更好的可維護性。
很多情況下，父組件中都會引用子組件這種情況。通過給在父組件中引用的子組件標簽上添加屬性，來渲染可以擁有不同數據的子組件。
但是vue 的組件有個特點，如果我們這一次和上一次傳過去的屬性值一樣的話，watch 監聽的屬性因為沒有新的變化(這次的值和上一次的值一樣watch 中調用的函數不執行)，導致對應的數據也沒有變化。
created() 生命周期函數也是只執行一次。（很尷尬，讓我這個用慣了react 的人剛開始還有點不適應。但是畢竟胳膊擰不過大腿不是，還是趕緊想辦法把。）
但是有時候我們需要這個組件每次都重新生成dom 元素，每次都執行created() 函數。這時候就用到了vue中的key 屬性。
key屬性和react 的key屬性基本上是一樣的（個人理解，如果有錯誤還請拍磚指正）。
key 屬性不是給開發人員用的，而是用來 給vue 元素渲染的時候用的，每次渲染的時候會去拿這個key 值做對比，如果這一次的key 值和上一次的key值是不一樣的才會重新渲染dom 元素，否則保持上一次的元素狀態。
根據這個原理我們可以給key 直接綁定一個 時間戳。
1 <template>
2 <div>
3 <div>
4 <h1>父級</h1>
5 <button @click="handleLoad">點擊重新加載子級</button>
6 </div>
7 <children :key="timer"></children>
8 </div>
9 </template>
10 <script>
11 import children from '@/components/parent/children'
12 export default {
13 name: 'parent',
14 components: { children },
15 data () {
16 return {
17 timer: ''
18 }
19 },
20 methods: {
21 handleLoad () {
22 this.timer = new Date().getTime()
23 }
24 }
25 }
26 </script>
1 <template>
2 <div>
3 子級
4 </div>
5 </template>
6 <script>
7 export default {
8 name: 'children',
9 data () {
10 return {}
11 },
12 created () {
13 console.log('重新加載啦')
14 }
15 }
16 </script>
每次點擊的時候都會重新加載子組件 ，created() 生命周期函數每次都會執行，重新生成dom 元素。也省的用watch 去監聽了！
