Merge pull request vuejs#205 from Alex-Sokolov/master

Новые правки

Author: Alex-Sokolov

_config.yml

@@ -112,10 +112,6 @@ offline:
       handler: networkFirst
       options:
         origin: ad.doubleclick.net
-    - urlPattern: /*
-      handler: networkFirst
-      options:
-        origin: srv.carbonads.net
     # CDNs - should be cacheFirst, since they should be used specific versions so should not change
     - urlPattern: /*
       handler: cacheFirst

src/v2/guide/components.md

@@ -501,14 +501,14 @@ Vue.component('example', {
 
 ``` js
 Vue.component('button-counter', {
-  template: '<button v-on:click="increment">{{ counter }}</button>',
+  template: '<button v-on:click="incrementCounter">{{ counter }}</button>',
   data: function () {
     return {
       counter: 0
     }
   },
   methods: {
-    increment: function () {
+    incrementCounter: function () {
       this.counter += 1
       this.$emit('increment')
     }
@@ -536,14 +536,14 @@ new Vue({
 </div>
 <script>
 Vue.component('button-counter', {
-  template: '<button v-on:click="increment">{{ counter }}</button>',
+  template: '<button v-on:click="incrementCounter">{{ counter }}</button>',
   data: function () {
     return {
       counter: 0
     }
   },
   methods: {
-    increment: function () {
+    incrementCounter: function () {
       this.counter += 1
       this.$emit('increment')
     }
@@ -565,7 +565,7 @@ new Vue({
 
 Важно отметить, что потомок остаётся полностью независимым от всего происходящего снаружи. Он всего лишь уведомляет внешний мир о происходящем с ним, на случай если родительскому компоненту это будет интересно.
 
-#### Подписка на нативные события в компонентах
+### Подписка на нативные события в компонентах
 
 Иногда нужно подписаться на нативные события браузера в корневом элементе компонента. В таких случаях можно применить `v-on` с модификатором `.native`, например так:
 

src/v2/guide/installation.md

@@ -88,7 +88,7 @@ $ npm run dev
 
 ### Runtime + Компилятор vs. Runtime-only
 
-Если вам нужно компилировать шаблоны на лету (например, если передавать строку в опцию `template`, или монтировать к элементу DOM, используя его HTML в качестве шаблона), вам потребуется компилятор и, таким образом, полная сборка:
+Если вам нужно компилировать шаблоны на клиенте (например, если передавать строку в опцию `template`, или монтировать к элементу DOM, используя его HTML в качестве шаблона), вам потребуется компилятор и, таким образом, полная сборка:
 
 ``` js
 // это требует компилятора

src/v2/guide/list.md

@@ -230,8 +230,8 @@ new Vue({ el: '#range' })
   v-for="(item, index) in items"
   v-bind:item="item"
   v-bind:index="index"
-  v-bind:key="item.id">
-</my-component>
+  v-bind:key="item.id"
+></my-component>
 ```
 
 Причина, по которой `item` не передаётся в компонент автоматически, в том, что это сделало бы компонент жёстко связанным с логикой работы `v-for`. А если источник данных указывается явно, компонент можно будет использовать и в других ситуациях.
@@ -249,8 +249,8 @@ new Vue({ el: '#range' })
     <li
       is="todo-item"
       v-for="(todo, index) in todos"
-      v-bind:key="index"
-      v-bind:title="todo"
+      v-bind:key="todo.id"
+      v-bind:title="todo.title"
       v-on:remove="todos.splice(index, 1)"
     ></li>
   </ul>
@@ -273,14 +273,27 @@ new Vue({
   data: {
     newTodoText: '',
     todos: [
-      'Вымыть посуду',
-      'Вынести мусор',
-      'Подстричь газон'
-    ]
+      {
+        id: 1,
+        title: 'Вымыть посуду'
+      },
+      {
+        id: 2,
+        title: 'Вынести мусор'
+      },
+      {
+        id: 3,
+        title: 'Подстричь газон'
+      }
+    ],
+    nextTodoId: 4
   },
   methods: {
     addNewTodo: function () {
-      this.todos.push(this.newTodoText)
+      this.todos.push({
+        id: this.nextTodoId++,
+        title: this.newTodoText
+      })
       this.newTodoText = ''
     }
   }
@@ -298,8 +311,8 @@ new Vue({
     <li
       is="todo-item"
       v-for="(todo, index) in todos"
-      v-bind:key="index"
-      v-bind:title="todo"
+      v-bind:key="todo.id"
+      v-bind:title="todo.title"
       v-on:remove="todos.splice(index, 1)"
     ></li>
   </ul>
@@ -319,14 +332,27 @@ new Vue({
   data: {
     newTodoText: '',
     todos: [
-      'Вымыть посуду',
-      'Вынести мусор',
-      'Подстричь газон'
-    ]
+      {
+        id: 1,
+        title: 'Вымыть посуду'
+      },
+      {
+        id: 2,
+        title: 'Вынести мусор'
+      },
+      {
+        id: 3,
+        title: 'Подстричь газон'
+      }
+    ],
+    nextTodoId: 4
   },
   methods: {
     addNewTodo: function () {
-      this.todos.push(this.newTodoText)
+      this.todos.push({
+        id: this.nextTodoId++,
+        title: this.newTodoText
+      })
       this.newTodoText = ''
     }
   }

src/v2/guide/transitions.md

@@ -153,7 +153,7 @@ new Vue({
 ```
 
 {% raw %}
-<div id="example-1">
+<div id="example-1" class="demo">
   <button @click="show = !show">
     Переключить рендеринг
   </button>
@@ -1520,7 +1520,7 @@ Vue.component('my-special-transition', {
 ``` html
 <script src="https://cdnjs.cloudflare.com/ajax/libs/velocity/1.2.3/velocity.min.js"></script>
 
-<div id="dynamic-fade-demo">
+<div id="dynamic-fade-demo" class="demo">
   Fade In: <input type="range" v-model="fadeInDuration" min="0" v-bind:max="maxFadeDuration">
   Fade Out: <input type="range" v-model="fadeOutDuration" min="0" v-bind:max="maxFadeDuration">
   <transition
@@ -1531,7 +1531,14 @@ Vue.component('my-special-transition', {
   >
     <p v-if="show">hello</p>
   </transition>
-  <button v-on:click="stop = true">Stop it!</button>
+  <button
+    v-if="stop"
+    v-on:click="stop = false; show = false"
+  >Запустить анимацию</button>
+  <button
+    v-else
+    v-on:click="stop = true"
+  >Остановить анимацию</button>
 </div>
 ```
 
@@ -1543,7 +1550,7 @@ new Vue({
     fadeInDuration: 1000,
     fadeOutDuration: 1000,
     maxFadeDuration: 1500,
-    stop: false
+    stop: true
   },
   mounted: function () {
     this.show = false
@@ -1595,7 +1602,14 @@ new Vue({
   >
     <p v-if="show">hello</p>
   </transition>
-  <button v-on:click="stop = true">Stop it!</button>
+  <button
+    v-if="stop"
+    v-on:click="stop = false; show = false"
+  >Запустить анимацию</button>
+  <button
+    v-else
+    v-on:click="stop = true"
+  >Остановить анимацию</button>
 </div>
 <script>
 new Vue({
@@ -1605,7 +1619,7 @@ new Vue({
     fadeInDuration: 1000,
     fadeOutDuration: 1000,
     maxFadeDuration: 1500,
-    stop: false
+    stop: true
   },
   mounted: function () {
     this.show = false