t m l > < h t m l l a n g = " e n " > < h e a d > < m e t a c h a r s e t = " u t f - 8 " > < t i t l e > V u e . J S < / t i t l e > < s t y l e > < / s t y l e > < / h e a d > < b o d y o n l o a d = " i n i t ( ) " > < d i v i d = " a p p " > { { m e s s a g e } } < / d i v > < s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e / l a t e s t / v u e . j s " > < s c r i p t t y p e = " t e x t / j a v a s c r i p t " > f u n c t i o n i n i t ( ) { n e w V u e ( { e l : ' # a p p ' , d a t a : { m e s s a g e : ' H e l l o V u e . j s ! ' } } ) ; } < / s c r i p t > < / b o d y > < / h t m l > Example #1 4 / 16
E h t m l > < h t m l l a n g = " e n " > < h e a d > < m e t a c h a r s e t = " u t f - 8 " > < t i t l e > V u e . J S < / t i t l e > < s t y l e > < / s t y l e > < / h e a d > < b o d y o n l o a d = " i n i t ( ) " > < d i v i d = " a p p " > < p > { { m e s s a g e } } < / p > < i n p u t v - m o d e l = " m e s s a g e " > < / d i v > < s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e / l a t e s t / v u e . j s " > < s c r i p t t y p e = " t e x t / j a v a s c r i p t " > f u n c t i o n i n i t ( ) { n e w V u e ( { e l : ' # a p p ' , d a t a : { m e s s a g e : ' H e l l o V u e . j s ! ' } } ) ; } < / s c r i p t > < / b o d y > < / h t m l > 5 / 16
t m l > < h t m l l a n g = " e n " > < h e a d > < m e t a c h a r s e t = " u t f - 8 " > < t i t l e > V u e . J S < / t i t l e > < s t y l e > < / s t y l e < / h e a d > < b o d y o n l o a d = " i n i t ( ) " > < d i v i d = " a p p " > < u l > < l i v - f o r = " t o d o i n t o d o s " > { { t o d o . t e x t } } < / l i > < / u l > < / d i v > < s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e / l a t e s t / v u e . j s " > < s c r i p t t y p e = " t e x t / j a v a s c r i p t " > f u n c t i o n i n i t ( ) { n e w V u e ( { e l : ' # a p p ' , d a t a : { t o d o s : [ { t e x t : ' L e a r n J a v a S c r i p t ' } , { t e x t : ' L e a r n V u e . j s ' } , { t e x t : ' B u i l d S o m e t h i n g A w e s o m e ' } ] } } ) ; } < / s c r i p t > < / b o d y > < / h t m l > Example #3 6 / 16
E h t m l > < h t m l l a n g = " e n " > < h e a d > < m e t a c h a r s e t = " u t f - 8 " > < t i t l e > V u e . J S < / t i t l e > < s t y l e > < / s t y l e < / h e a d > < b o d y o n l o a d = " i n i t ( ) " > < d i v i d = " a p p " > < p > { { m e s s a g e } } < / p > < b u t t o n v - o n : c l i c k = " r e v e r s e M e s s a g e " > R e v e r s e M e s s a g e < / b u t t o < / d i v > < s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e / l a t e s t / v u e . j s " > < s c r i p t t y p e = " t e x t / j a v a s c r i p t " > f u n c t i o n i n i t ( ) { n e w V u e ( { e l : ' # a p p ' , d a t a : { m e s s a g e : ' H e l l o V u e . j s ! ' } , m e t h o d s : { r e v e r s e M e s s a g e : f u n c t i o n ( ) { t h i s . m e s s a g e = t h i s . m e s s a g e . s p l i t ( ' ' ) . r e v e r s e ( ) . j o i n } } } ) ; } < / s c r i p t > < / b o d y > < / h t m l > 7 / 16
t m l > < h t m l l a n g = " e n " > < h e a d > < m e t a c h a r s e t = " u t f - 8 " > < t i t l e > V u e . J S < / t i t l e > < s t y l e > < / s t y l e < b o d y o n l o a d = " i n i t ( ) " > < d i v i d = " a p p " > < i n p u t v - m o d e l = " n e w T o d o " v - o n : k e y u p . e n t e r = " a d d T o d o " > < u l > < l i v - f o r = " t o d o i n t o d o s " > < s p a n > { { t o d o . t e x t } } < / s p a n > < b u t t o n v - o n : c l i c k = " r e m o v e T o d o ( $ i n d e x ) " > X < / b u t t o n > < / l i > < / u l > < / d i v > < s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e / l a t e s t / v u e . j s " > < s c r i p t t y p e = " t e x t / j a v a s c r i p t " > f u n c t i o n i n i t ( ) { n e w V u e ( { e l : ' # a p p ' , d a t a : { n e w T o d o : ' ' , t o d o s : [ { t e x t : ' A d d s o m e t o d o s ' } ] } , m e t h o d s : { a d d T o d o : f u n c t i o n ( ) { v a r t e x t = t h i s . n e w T o d o . t r i m ( ) i f ( t e x t ) { t h i s . t o d o s . p u s h ( { t e x t : t e x t } ) ; t h i s } , r e m o v e T o d o : f u n c t i o n ( i n d e x ) { t h i s . t o d o s . s p l i c e ( i n d e x , } } ) ; } < / s c r i p t > < / b o d y > < / h t m l > Example #5 8 / 16
e h t m l > < h t m l > < h e a d > < m e t a c h a r s e t = " u t f - 8 " > < t i t l e > V u e < / t i t l e > < l i n k r e l = " s t y l e s h e e t " h r e f = " h t t p s : / / m a x c d n . b o o t s t r a p c d n . c o m / b o o t s t r a p / 3 . 3 . 6 / c s s / b o o t s t r a p . m i n . c s s " < s t y l e > . f o r m - c o n t r o l { m a r g i n - b o t t o m : 1 0 p x ; } < / s t y l e > < / h e a d > < b o d y > < n a v c l a s s = " n a v b a r n a v b a r - d e f a u l t " > < d i v c l a s s = " c o n t a i n e r - f l u i d " > < a c l a s s = " n a v b a r - b r a n d " > < i c l a s s = " g l y p h i c o n g l y p h i c o n - b u l l h o r n " < / d i v > < / n a v > . . . < / b o d y > < s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e / l a t e s t / v u e . j s " > < / < s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e . r e s o u r c e / 0 . 1 . 1 7 / v u e - r e s o u r c e . m i n . j s " < s c r i p t s r c = " v u e - s c o t c h i o - 1 . j s " > < / s c r i p t > < / h t m l > vue-schotchio-1.html < d i v c l a s s = " c o n t a i n e r " i d = " e v e n t s " > < d i v c l a s s = " c o l - s m - 6 " > < d i v c l a s s = " p a n e l p a n e l - d e f a u l t " > < d i v c l a s s = " p a n e l - h e a d i n g " > < h 3 > A d d a n E v e n t < / h 3 > < / d i v > < d i v c l a s s = " p a n e l - b o d y " > < d i v > < i n p u t c l a s s = " f o r m - c o n t r o l " p l a c e h o l d e r = " E v e n t N a m e " < t a g - t e x t a r e a c l a s s = " f o r m - c o n t r o l " p l a c e h o l d e r = " E v e n < i n p u t t y p e = " d a t e " c l a s s = " f o r m - c o n t r o l " p l a c e h o l d e r < b u t t o n c l a s s = " b t n b t n - p r i m a r y " v - o n : c l i c k = " a d d E v e n t < / d i v > < / d i v > < / d i v > < / d i v > < d i v c l a s s = " c o l - s m - 6 " > < d i v c l a s s = " l i s t - g r o u p " > < a h r e f = " # " c l a s s = " l i s t - g r o u p - i t e m " v - f o r = " e v e n t i n e v e n < h 4 c l a s s = " l i s t - g r o u p - i t e m - h e a d i n g " > < i c l a s s = " g l y p h i c o < h 5 > < i c l a s s = " g l y p h i c o n g l y p h i c o n - c a l e n d a r " v - i f = " e v e n < p c l a s s = " l i s t - g r o u p - i t e m - t e x t " v - i f = " e v e n t . d e s c r i p t i o < b u t t o n c l a s s = " b t n b t n - x s b t n - d a n g e r " v - o n : c l i c k = " d e l e < / a > < / d i v > < / d i v > < / d i v > 10 / 16
e l : ' # e v e n t s ' , d a t a : { e v e n t : { n a m e : ' ' , d e s c r i p t i o n : ' ' , d a t e : ' ' } , e v e n t s : [ ] } , r e a d y : f u n c t i o n ( ) { t h i s . f e t c h E v e n t s ( ) ; } , m e t h o d s : { . . . } } ) ; vue-scotchio-1.js m e t h o d s : { f e t c h E v e n t s : f u n c t i o n ( ) { v a r e v e n t s = [ { i d : 1 , n a m e : ' T I F F ' , d e s c r i p t i o n : ' T o r o n t o I n t e r n a t i { i d : 2 , n a m e : ' T h e M a r t i a n P r e m i e r e ' , d e s c r i p t i o n : { i d : 3 , n a m e : ' S X S W ' , d e s c r i p t i o n : ' M u s i c , f i l m a n d i ] ; t h i s . $ s e t ( ' e v e n t s ' , e v e n t s ) ; c o n s o l e . l o g ( J S O N . s t r i n g i f y ( e v e n t s ) ) ; } , a d d E v e n t : f u n c t i o n ( ) { i f ( t h i s . e v e n t . n a m e ) { t h i s . e v e n t s . p u s h ( t h i s . e v e n t ) ; t h i s . e v e n t = { n a m e : ' ' , d e s c r i p t i o n : ' ' , d a t e : ' ' } ; } } , d e l e t e E v e n t : f u n c t i o n ( i n d e x ) { i f ( c o n f i r m ( " A r e y o u s u r e y o u w a n t t o d e l e t e t h i s e v e n t ? " t h i s . e v e n t s . $ r e m o v e ( i n d e x ) ; } } } 11 / 16
s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e / l a t e s t / v u e . j s " > < / < s c r i p t s r c = " h t t p s : / / c d n . j s d e l i v r . n e t / v u e . r e s o u r c e / 0 . 1 . 1 7 / v u e - r e s o u r c e . m i n . j s " < s c r i p t s r c = " v u e - s c o t c h i o - 2 . j s " > < / s c r i p t > < / h t m l > m e t h o d s : { f e t c h E v e n t s : f u n c t i o n ( ) { t h i s . $ h t t p . g e t ( ' v u e - s c o t c h i o - 2 . j s o n ' ) . s u c c e s s ( f u n c t i o n t h i s . $ s e t ( ' e v e n t s ' , e v e n t s ) ; } ) . e r r o r ( f u n c t i o n ( e r r o r ) { c o n s o l e . l o g ( e r r o r ) ; } ) ; } , a d d E v e n t : f u n c t i o n ( ) { . . . } , d e l e t e E v e n t : f u n c t i o n ( i n d e x ) { . . . } } vue-scotchio-2.json [ { " i d " : 1 , " n a m e " : " T I F F " , " d e s c r i p t i o n " : " T o r o n t o I n t e r n a t i o n a l F i l m F e s t i v a l " , " d a t e " : " 2 0 1 5 - 0 9 - 1 0 " } , { " i d " : 2 , " n a m e " : " T h e M a r t i a n P r e m i e r e " , " d e s c r i p t i o n " : " T h e M a r t i a n c o m e s t o t h e a t r e s . " , " d a t e " : " 2 0 1 5 - 1 0 - 0 2 " } , { " i d " : 3 , " n a m e " : " S X S W " , " d e s c r i p t i o n " : " M u s i c , f i l m a n d i n t e r a c t i v e f e s t i v a l i n A u " d a t e " : " 2 0 1 6 - 0 3 - 1 1 " } ] 13 / 16
eueung
sonatard
nearme_tech
onomax
1wedge_one
satoshi7190
bkuhlmann
inouehi
o0h
honnibal
kasacchiful
quiver
sugarenia
tanoku
deanohume
palkan
tmm1
bkeepers
wjessup
tammyeverts
jmmastey
mclloyd
tenderlove
searls
