@@ -35,35 +35,26 @@ Vue timer hook is a custom [vue 3 hook](https://vue.org/docs/hooks-intro.html),
35
35
</template >
36
36
37
37
38
- <script lang =" ts" >
39
- import { defineComponent , watchEffect , onMounted } from " vue" ;
38
+ <script setup lang =" ts" >
39
+ import { watchEffect , onMounted } from " vue" ;
40
40
import { useTimer } from ' vue-timer-hook' ;
41
41
42
- export default defineComponent ({
43
- name: " Home" ,
44
- setup () {
42
+ const time = new Date ();
43
+ time .setSeconds (time .getSeconds () + 600 ); // 10 minutes timer
44
+ const timer = useTimer (time);
45
+ const restartFive = () => {
46
+ // Restarts to 5 minutes timer
45
47
const time = new Date ();
46
- time .setSeconds (time .getSeconds () + 600 ); // 10 minutes timer
47
- const timer = useTimer (time);
48
- const restartFive = () => {
49
- // Restarts to 5 minutes timer
50
- const time = new Date ();
51
- time . setSeconds ( time . getSeconds () + 300 );
52
- timer . restart (time);
48
+ time .setSeconds (time .getSeconds () + 300 );
49
+ timer . restart (time);
50
+ }
51
+ onMounted (() => {
52
+ watchEffect ( async () => {
53
+ if ( timer . isExpired . value ) {
54
+ console . warn ( ' IsExpired ' )
53
55
}
54
- onMounted (() => {
55
- watchEffect (async () => {
56
- if (timer .isExpired .value ) {
57
- console .warn (' IsExpired' )
58
- }
59
- })
60
- })
61
- return {
62
- timer,
63
- restartFive,
64
- };
65
- },
66
- });
56
+ })
57
+ })
67
58
</script >
68
59
```
69
60
@@ -113,20 +104,12 @@ export default defineComponent({
113
104
</template >
114
105
115
106
116
- <script lang =" ts" >
107
+ <script setup lang =" ts" >
117
108
import { defineComponent } from " vue" ;
118
109
import { useStopwatch } from ' vue-timer-hook' ;
119
110
120
- export default defineComponent ({
121
- name: " Home" ,
122
- setup () {
123
- const autoStart = true ;
124
- const stopwatch = useStopwatch (autoStart);
125
- return {
126
- stopwatch,
127
- };
128
- },
129
- });
111
+ const autoStart = true ;
112
+ const stopwatch = useStopwatch (autoStart);
130
113
</script >
131
114
```
132
115
0 commit comments