From f69834b987d4eff24f31c0666a466409c24519b8 Mon Sep 17 00:00:00 2001
From: Vasiliy Mikhaylovsky <github@3apaxi.com>
Date: Wed, 6 Feb 2019 03:18:31 +0500
Subject: [PATCH] Change "Keyed each blocks" to v3

https://v3.svelte.technology/repl?version=3.0.0-beta.1&gist=f39ae2d72b85b84415aed58acdc43d87
---
 site/content/guide/18-advanced.md | 32 ++++++++++++-------------------
 1 file changed, 12 insertions(+), 20 deletions(-)

diff --git a/site/content/guide/18-advanced.md b/site/content/guide/18-advanced.md
index 7ebd2ef850..51e4622176 100644
--- a/site/content/guide/18-advanced.md
+++ b/site/content/guide/18-advanced.md
@@ -18,7 +18,7 @@ It's easier to show the effect of this than to describe it. Open the following e
 
 ```html
 <!-- { title: 'Keyed each blocks' } -->
-<button on:click="update()">update</button>
+<button on:click="{update}">update</button>
 
 <section>
 	<h2>Keyed</h2>
@@ -46,29 +46,21 @@ It's easier to show the effect of this than to describe it. Open the following e
 </style>
 
 <script>
-	import { slide } from 'svelte-transitions';
-
-	var people = ['Alice', 'Barry', 'Cecilia', 'Douglas', 'Eleanor', 'Felix', 'Grace', 'Horatio', 'Isabelle'];
+	import { slide } from 'svelte/transition';
 
+	const names = ['Alice', 'Barry', 'Cecilia', 'Douglas', 'Eleanor', 'Felix', 'Grace', 'Horatio', 'Isabelle'];
+	
 	function random() {
-		return people
+		return names
 			.filter(() => Math.random() < 0.5)
-			.map(name => ({ name }))
+			.map(name => ({ name }));
+	}
+	
+	let people = random();
+	
+	function update() {
+		people = random();
 	}
-
-	export default {
-		data() {
-			return { people: random() };
-		},
-
-		methods: {
-			update() {
-				this.set({ people: random() });
-			}
-		},
-
-		transitions: { slide }
-	};
 </script>
 ```