chandrunaik · May 10, 2020 · May 14, 2020 · May 14, 2020 · May 14, 2020 · May 14, 2020
diff --git a/README.md b/README.md
@@ -1,29 +1,28 @@
 <p>
   <a href="https://travis-ci.org/tangbc/vue-virtual-scroll-list">
-    <img alt="Travis CI Status" src="https://travis-ci.org/tangbc/vue-virtual-scroll-list.svg?branch=master"/>
+    <img alt="CIStatus" src="https://travis-ci.org/tangbc/vue-virtual-scroll-list.svg?branch=master"/>
   </a>
   <!-- <a href="https://codecov.io/gh/tangbc/vue-virtual-scroll-list">
     <img alt="Code Coverage" src="https://codecov.io/gh/tangbc/vue-virtual-scroll-list/branch/master/graph/badge.svg"/>
   </a> -->
-  <a href="https://npmjs.com/package/vue-virtual-scroll-list">
-    <img alt="NPM downloads" src="https://img.shields.io/npm/dm/vue-virtual-scroll-list.svg">
+  <a href="https://npm-stat.com/charts.html?package=vue-virtual-scroll-list">
+    <img alt="Downloads" src="https://img.shields.io/npm/dm/vue-virtual-scroll-list.svg">
   </a>
   <a href="https://npmjs.com/package/vue-virtual-scroll-list">
-    <img alt="NPM version" src="https://img.shields.io/npm/v/vue-virtual-scroll-list.svg"/>
+    <img alt="Version" src="https://img.shields.io/npm/v/vue-virtual-scroll-list.svg"/>
   </a>
   <!-- <a href="https://vuejs.org/">
     <img alt="Vue version" src="https://img.shields.io/badge/vue-%3E=2.3.0-brightgreen.svg"/>
   </a> -->
   <a href="http://packagequality.com/#?package=vue-virtual-scroll-list">
-    <img alt="Package quality" src="https://npm.packagequality.com/shield/vue-virtual-scroll-list.svg">
+    <img alt="Quality" src="https://npm.packagequality.com/shield/vue-virtual-scroll-list.svg">
   </a>
 </p>
 
 ## Table of contents
 
 * [Advantages](#advantages)
 * [Live demo](#live-demo)
-* [What's new in v2.0](#whats-new-in-v20)
 * [Simple usage](#simple-usage)
 * [**Props type**](#props-type)
   * [Required props](#required-props)
@@ -48,13 +47,6 @@ https://tangbc.github.io/vue-virtual-scroll-list
 https://codesandbox.io/s/live-demo-virtual-list-e1ww1
 
 
-## What's new in v2.0
-
-Here are the major of update informations with [release v2.0](https://github.com/tangbc/vue-virtual-scroll-list/releases/tag/v2.0.0).
-
-Since the `v2.0` is **not compatible** with `v1.x`, please note before upgrading, `v1.x` documentation see [v1.x.md](https://github.com/tangbc/vue-virtual-scroll-list/blob/master/v1.x.md).
-
-
 ## Simple usage
 
 ```bash
@@ -69,7 +61,6 @@ Root component:
       :data-key="'uid'"
       :data-sources="items"
       :data-component="itemComponent"
-      :extra-props="{ otherPropValue: otherDataAssginToItemComponet }"
     />
   </div>
 </template>
@@ -83,8 +74,7 @@ Root component:
     data () {
       return {
         itemComponent: Item,
-        items: [{uid: 'unique_1', text: 'abc'}, {uid: 'unique_2', text: 'xyz'}, ...],
-        otherDataAssginToItemComponet: 'The Progressive JavaScript Framework'
+        items: [{uid: 'unique_1', text: 'abc'}, {uid: 'unique_2', text: 'xyz'}, ...]
       }
     },
     components: { 'virtual-list': VirtualList }
@@ -95,7 +85,7 @@ Root component:
 Item component:
 ```vue
 <template>
-  <div>{{ index }} - {{ source.text }} - {{ otherPropValue }}</div>
+  <div>{{ index }} - {{ source.text }}</div>
 </template>
 
 <script>
@@ -110,8 +100,7 @@ Item component:
         default () {
           return {}
         }
-      },
-      otherPropValue: String // here is: 'The Progressive JavaScript Framework'
+      }
     }
   }
 </script>
@@ -124,11 +113,11 @@ More usages or getting start you can refer to these clearly [examples](https://g
 
 ### Required props
 
-| **&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Prop&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;** | **Type**  | **Description**                                                                                                                              |
-|------------------|---------------|---------------------------------------------------------------------------------------------------------------------------------------------------|
-| `data-key`       | String        | The unique key get from `data-sources` in each data object, its value **must be unique** in `data-sources`, it is used for identifying item size. |
-| `data-sources`   | Array[Object] | The source array built for list, each array data must be an object and has an unique key for `data-key` property.                                 |
-| `data-component` | Component     | The render item component created / declared by vue, and it will use the data object in `datas-sources` as render prop and named: `source`.       |
+| **&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Prop&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;** | **Type**  | **Description**                                                               |
+|------------------|------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| `data-key`       | String\|Function | The unique key get from `data-sources` in each data object. Or a function called with each `data-source` and return their unique key. Its value **must be unique** in `data-sources`, it is used for identifying item size. |
+| `data-sources`   | Array[Object]    | The source array built for list, each array data must be an object and has an unique key get or generate for `data-key` property.                                                                                           |
+| `data-component` | Component        | The render item component created / declared by vue, and it will use the data object in `data-sources` as render prop and named: `source`.                                                                                  |
 
 ### Optional props
 
@@ -137,7 +126,7 @@ More usages or getting start you can refer to these clearly [examples](https://g
   <p></p>
   <table>
     <tr>
-      <th>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Props&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</th>
+      <th>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Prop&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</th>
       <th>Type</th>
       <th>Default</th>
       <th>Description</th>
@@ -158,7 +147,7 @@ More usages or getting start you can refer to these clearly [examples](https://g
       <td><code>estimate-size</code></td>
       <td>Number</td>
       <td>50</td>
-      <td>The estimate size of each item, if it is closer to the average size, the scrollbar length looks more accurately. It is recommended to assign the average that calculate by yourself.</td>
+      <td>The estimate size of each item, if it is closer to the average size, the scrollbar length looks more accurately. It is <strong>recommended</strong> to assign the average that calculate by yourself.</td>
     </tr>
   </table>
 </details>
@@ -168,7 +157,7 @@ More usages or getting start you can refer to these clearly [examples](https://g
   <p></p>
   <table>
     <tr>
-      <th>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Props&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</th>
+      <th>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Prop&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</th>
       <th>Type</th>
       <th>Default</th>
       <th>Description</th>
@@ -281,6 +270,12 @@ More usages or getting start you can refer to these clearly [examples](https://g
       <td>{}</td>
       <td>Item wrapper element inline style.</td>
     </tr>
+    <tr>
+      <td><code>item-scoped-slots</code></td>
+      <td>Object</td>
+      <td>{}</td>
+      <td>The <code>$scopedSlots</code> for item component.</td>
+    </tr>
     <tr>
       <td><code>header-tag</code></td>
       <td>String</td>
@@ -379,7 +374,7 @@ More usages or getting start you can refer to these clearly [examples](https://g
 
 This component use an `in-place patch` strategy to render list instead of `v-for` and `:key`. This way achieves the best efficient, but only suitable when your list output does not rely on item component inner state or temporary DOM state (e.g. form input values).
 
-But how to deal with such a situation? Without maintaining inner state, recommend to use props and dispatch (stateless component), here is an example [keep-state](https://tangbc.github.com/vue-virtual-scroll-list/#/keep-state).
+But how to deal with such a situation? Without maintaining inner state, recommend to use props and dispatch (stateless component), here is an example [keep-state](https://tangbc.github.io/vue-virtual-scroll-list/#/keep-state).
 
 
 ## Contributions