SHARE
TWEET

Untitled

a guest Apr 24th, 2019 79 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import { bootstrap, Component, fdValue, createComponent, createRouter, Router, fdFor, fdIf } from 'faster-dom';
  2.  
  3. class Counter extends Component {
  4.   reactive = {
  5.     counter: fdValue(0)
  6.   }
  7.  
  8.   template = {
  9.     tag: "span",
  10.     textValue: this.reactive.counter,
  11.     listeners: {
  12.       click: () => {
  13.         this.reactive.counter.value++
  14.       }
  15.     }
  16.   }
  17. }
  18.  
  19. class HelloWorld extends Component {
  20.   template = {
  21.     tag: "span",
  22.     textValue: "HelloWorld"
  23.   }
  24. }
  25.  
  26. function createHelloWolrd() {
  27.   return createComponent(HelloWorld)
  28. }
  29.  
  30. function createCounter() {
  31.   return createComponent(Counter)
  32. }
  33.  
  34. bootstrap('#first', () => {
  35.   const list = [
  36.     {
  37.       name: 'Hello',
  38.       path: '/',
  39.       click: () => {
  40.         Router.goToUrl('/')
  41.       }
  42.     },
  43.     {
  44.       name: 'Counter',
  45.       path: '/counter',
  46.       click: () => {
  47.         Router.goToUrl('/counter')
  48.       }
  49.     },
  50.   ]
  51.   return {
  52.     tag: "div",
  53.     children: [
  54.       fdFor(list, (item) => {
  55.         return {
  56.           tag: "button",
  57.           textValue: item.name,
  58.           listeners: {
  59.             click: () => item.click()
  60.           }
  61.         }
  62.       }, [(e: any) => e]),
  63.       createRouter({
  64.         '/': {
  65.           component: createHelloWolrd,
  66.           title: "Hello Wolrd",
  67.         },
  68.         '/counter': {
  69.           component: createCounter,
  70.           title: "Counter",
  71.         }
  72.       })
  73.     ]
  74.   }
  75. })
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top