File tree Expand file tree Collapse file tree 1 file changed +12
-0
lines changed Expand file tree Collapse file tree 1 file changed +12
-0
lines changed Original file line number Diff line number Diff line change 1
1
var app = new Vue ( {
2
2
3
+ // the root element that will be compiled
3
4
el : '#todoapp' ,
4
5
6
+ // a custom directive to wait for the DOM to be updated
7
+ // before focusing on the input field.
5
8
directives : {
6
9
'todo-focus' : function ( value ) {
7
10
if ( value ) {
@@ -11,6 +14,8 @@ var app = new Vue({
11
14
}
12
15
} ,
13
16
17
+ // the `created` lifecycle hook.
18
+ // it will be called when the ViewModel instance is created.
14
19
created : function ( ) {
15
20
this . filters = {
16
21
all : function ( todo ) { todo . completed ; return true } ,
@@ -26,8 +31,13 @@ var app = new Vue({
26
31
} ) . length
27
32
} ,
28
33
34
+ // data
29
35
data : {
36
+
37
+ // fetch the saved todos from localStorage
30
38
todos : todoStorage . fetch ( ) ,
39
+
40
+ // a computed property with custom getter/setter
31
41
allDone : {
32
42
$get : function ( ) {
33
43
return this . remaining === 0
@@ -42,6 +52,8 @@ var app = new Vue({
42
52
}
43
53
} ,
44
54
55
+ // methods that implement data logic.
56
+ // note there's no DOM manipulation here at all!
45
57
methods : {
46
58
47
59
updateFilter : function ( ) {
You can’t perform that action at this time.
0 commit comments