1. 程式人生 > >Vue2.0中v-for迭代語法變化(key、index)

Vue2.0中v-for迭代語法變化(key、index)

今天,在寫關於Vue2.0的程式碼中發現 $key這個值並不能渲染成功,問題如下:

這裡寫圖片描述

結果這個物件的key值並不能夠顯示:

這裡寫圖片描述

後來查閱了文件才知道,這是因為在Vue2.0中,v-for迭代語法已經發生了變化:

丟棄了:

這裡寫圖片描述

新陣列語法
value in arr
(value, index) in arr

新物件語法
value in obj (value, key) in obj
(value, key, index) in obj

解決後:

這裡寫圖片描述

這裡寫圖片描述

相關推薦

Vue2.0v-for語法變化keyindex

今天,在寫關於Vue2.0的程式碼中發現 $key這個值並不能渲染成功,問題如下: 結果這個物件的key值並不能夠顯示: 後來查閱了文件才知道,這是因為在Vue2.0中,v-for迭代語法已

Vue2.0v-for語法變化keyindex

分鐘 eth data href head htm ref fields type 語法發生了變化:http://blog.csdn.net/sinat_35512245/article/details/53966788 新數組語法 value in arr (value,

C++標準模板庫---器介紹iteratorconst_iterator

迭代器 概念:C++的一種機制,用來遍歷標準模板庫容器中的元素,是一種"智慧"指標 一、迭代器的特點 迭代器是一種智慧指標,具有遍歷複雜資料結構的能力 不同的容器有不一樣的內部結構,因此會有一樣的迭代器型別 迭代器定義後,並不屬於某一例項容器物件,只要是屬於該迭代器

vue2.0v-on綁定自定義事件的理解

按鈕 自定義事件 監聽器 code 自定義 pre strong 數據 解耦 vue中父組件通過prop傳遞數據給子組件,而想要將子組件的數據傳遞給父組件,則可以通過自定義事件的綁定。 每個Vue實例都實現了【事件接口】,即: 1、使用 $on(eventName) 監聽事

vue2.0v-on繫結自定義事件

vue中父元件通過prop傳遞資料給子元件,而想要將子元件的資料傳遞給父元件,則可以通過自定義事件的繫結。 每個 Vue 例項都實現了事件介面,即: 使用 $on(eventName) 監聽事件 使用 $emit(eventName) 觸發事

v-for,以及瀏覽器通過瀏覽器新增資料

v-for完成迭代後,持續控制瀏覽器的頁面,為非同步操作提供可能。 直接載入的頁面: 通過瀏覽器除錯工具,新增如圖程式碼,回車即可完成: 注意:新增物件時候有時不知道什麼原因,就是不能正確執行程式碼,可以在自己的整合開發環境中,直接拷貝同類物件,修改即可。

遍歷聚合物件的元素——器模式

3 完整解決方案       為了簡化AbstractObjectList類的結構,並給不同的具體資料集合類提供不同的遍歷方式,Sunny軟體公司開發人員使用迭代器模式來重構AbstractObjectList類的設計,重構之後的銷售管理系統資料遍歷結構如圖4所示:圖4銷售管

遍歷聚合物件的元素——器模式

6 迭代器模式總結 迭代器模式是一種使用頻率非常高的設計模式,通過引入迭代器可以將資料的遍歷功能從聚合物件中分離出來,聚合物件只負責儲存資料,而遍歷資料由迭代器來完成。由於很多程式語言的類庫都已經實現了

<C++學習十三>C++器介紹未完待續

摘要: 本篇部落格僅作為筆記,如有侵權,請聯絡,立即刪除(網上找部落格學習,然後手記筆記,因紙質筆記不便儲存,所以儲存到網路筆記)   迭代器簡介:   (1)迭代器類似於指標型別,它也提供了對物件的間接訪問。   (2)指標是C語言中就有的東西,迭代器是C++中才有的,指標用起來靈活高效,迭代器功能更

SGISTL原始碼閱讀六 器下traits程式設計技法

SGISTL原始碼閱讀六 迭代器下(traits程式設計技法) 前言 上一篇部落格我們瞭解了迭代器的相應型別,簡單的引數推導機制可以實現針對不同的型別進行不同的操作,但是這並不能解決所有的情況。本文章將要介紹_STL原始碼門鑰_——traits程式設計技法。 凡是原生指標,都沒有

js陣列的器方法someeveryforEachmapfilter)

//陣列操作之迭代器方法(這些方法可以對陣列中的每一個元素運用某個方法) //一、不生成新陣列的迭代器方法 //1、forEach方法(接收一個函式作為引數) function square(num){ alert(num * n

行為型:設計模式之器模式二十一

 20世紀80年代,那時我家有一臺“古老的”電視機,牌子我忘了,只記得是臺黑白電視機,沒有遙控器,每次開關機或者換臺都需要通過電視機上面的那些按鈕來完成,我印象最深的是那個用來換臺的按鈕,需要親自用手去旋轉(還要使點勁才能擰動),每轉一下就“啪”的響一聲,如果沒有收到任何電視訊道就會出現一片讓人眼花的雪花點。

Python2語法簡記45:條件語句迴圈語句

4 條件語句:if…elif…else,不支援switch num = 5 if num == 3: print 'boss' elif num == 2: print 'user' # 如果一個條件語句只有一條語句,可以用簡單寫法 else:

Linux字元裝置的兩個重要結構體fileinode

對於Linux系統中,一般字元裝置和驅動之間的函式呼叫關係如下圖所示 上圖描述了使用者空間應用程式通過系統呼叫來呼叫程式的過程。一般而言在驅動程式的設計中,會關係 struct file 和 struct inode 這兩個結構體。 使用者空間使用open()系統呼叫函式開啟一個字元裝置時( int fd

vue.js 1.0中用v-for遍歷出的li的@click事件在移動端無效

play 需要 data class import child exp ons rec 在vue.js使用v-for遍歷出的li中的@click事件在移動端無效,在網頁端可以執行,代碼如下 <template> <div class="rating-

Vue2.0使用v-el,v-rel出現問題

問題描述 在高仿餓了麼實戰專案中使用v-el指令獲取DOM,但出現下圖的錯誤:   v-el指令   程式碼 template   template script   script  

Vue2.0 心法 ==> 第六層:vue2.0 使用sass語法

1.第一步當然是安裝 npm install node-sass --save-dev npm install sass-loader --save-dev 或 cnpm install

vuev-for索引不要用key

spa 定義 pan class col color key 特性 不出 今天發現在給元素v-for渲染的時候,想給元素添加key特性存儲索引,發現不奏效: <div class="apic" v-for="(pic,index) in msg.pics" ..

vue2.0 #$emit,$on的使用詳解

額外 return turn isp div 傳遞 call sele 發的 vue1.0中 vm.$dispatch 和 vm.$broadcast 被棄用,改用$emit,$on 1. vm.$on( event, callback ) 監聽當前實例上的自定義事件。

vue2.0的watch和計算屬性computed

str rect register rst 定向 one 特點 created doc watch和computed均可以監控程序員想要監控的對象,當這些對象發生改變之後,可以觸發回調函數做一些邏輯處理 watch監控自身屬性變化 <!DOCTYPE html&