• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript dom.makeDOMDriver函数代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中@cycle/dom.makeDOMDriver函数的典型用法代码示例。如果您正苦于以下问题:TypeScript makeDOMDriver函数的具体用法?TypeScript makeDOMDriver怎么用?TypeScript makeDOMDriver使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。



在下文中一共展示了makeDOMDriver函数的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: startPanel

export function startPanel(graph$: Stream<string>): void {
  const adHocContainer: Element = document.createElement('DIV');
  adHocContainer.id = '#ad-hoc-container';
  document.body.appendChild(adHocContainer);
  const domDriver = makeDOMDriver(
    document.querySelector('#tools-container') || adHocContainer,
  );

  const domSinkProxy = xs.create<VNode>();
  const domSource = domDriver(domSinkProxy, xsSA);

  const panelSources = {graph: graph$, DOM: domSource};
  const panelSinks = Panel(panelSources);

  styles.inject();
  domSinkProxy.imitate(panelSinks.DOM);
  panelSinks.zapSpeed.addListener({
    next(s: ZapSpeed) {
      // alert('PANEL posting message to graph serializer: ' + s);
      window['postMessageToGraphSerializer'](s);
    },
    error(err: any) { },
    complete() { },
  });
}
开发者ID:whitecolor,项目名称:cyclejs,代码行数:25,代码来源:index.ts


示例2: run

import main from './main';
import { run } from '@cycle/xstream-run';
import { makeDOMDriver } from '@cycle/dom';

run(main, {
  dom: makeDOMDriver('#app')
});
开发者ID:artfuldev,项目名称:recall-cycle,代码行数:7,代码来源:app.ts


示例3: run

import {run} from '@cycle/xstream-run';
import {makeDOMDriver} from '@cycle/dom';
import Counter from './Counter';

const main = Counter;

run(main, {
  DOM: makeDOMDriver('#main-container')
});
开发者ID:mxstbr,项目名称:cyclejs-counter,代码行数:9,代码来源:index.ts


示例4: require

import {test} from '../testsuite';
import {bowlingLineTests} from './bowlingLine/index.spec';
import {makeDOMDriver} from '@cycle/dom';
import {run} from '@cycle/rxjs-run';
import {main} from './main';
import {mainTests} from './main.spec';
require('./styles.css');

test('FRP Bowling Kata', function() {
  test('FRP Bowling Kata Application Mainline', mainTests);
  test('FRP Bowling Kata BowlingLine Component', bowlingLineTests);
});

run(main, {DOM: makeDOMDriver('#app')});
开发者ID:wizardwerdna,项目名称:FRPBowlingKata,代码行数:14,代码来源:app.ts


示例5: div

        transform: `translate(${link.position.x}px, ${link.position.y}px)`
      }
    }, [img({ attrs: { src: link.image }})]))

  return div(vnodes)
}

function main({ time, DOM }) {

  const raf$ = time.animationFrames()

  const pause$ = DOM
    .select("document")
    .events("keyup")
    .filter(event => event.keyCode == 32)
    .fold(acc => !acc, false)

  return {
    DOM: raf$
      .compose(sampleCombine(pause$))
      .filter(([_, paused]) => !paused)
      .fold(updateState, links)
      .map(render)
  }
}

run(main, {
    DOM: makeDOMDriver("#main"),
    time: timeDriver
});
开发者ID:atomrc,项目名称:find.thomasbelin.fr,代码行数:30,代码来源:application.ts


示例6: run

    //       return {
    //         name: s.name,
    //         input
    //       }
    //     }).debug((x: any) => console.log('debug', x)) // Object {name...}
    // ).debug((x: any) => console.log('debug2', x)) // Stream
    // .flatten()
    // .debug((x: any) => console.log('debug3', x)) // nothing
    sendUpdate: xs.combine(
      state$.compose(dropRepeats<Model>((a, b) => a.shows === b.shows)),
      keyboard.filter((x: Input) => x === 'increment' || x === 'decrement')
    )
      .compose(debounce(100))
      .map(([state, input]: [Model, Input]): Update => {
        const s = state.shows[state.cursor];
        return {
          name: s.name,
          count: s.count,
          input
        }
      })
  };
}

run(main, {
  DOM: makeDOMDriver('#app'),
  keyboard: makeKeyboardDriver(),
  scrollIntoView: makeScrollIntoViewDriver(),
  sendUpdate: makeSendUpdateDriver()
});
开发者ID:justinwoo,项目名称:tracker,代码行数:30,代码来源:index.ts


示例7: makeDOMDriver

      data: { id, label }
    })),
    board.noteDelete$.map(id => ({
      type: 'delete-note',
      data: { id }
    }))
  )

  return {
    DOM: board.DOM,
    websocket: Stream.merge(boardWebsocket$, Stream.of({ type: 'init' }))
      .debug('websocket$'),
    preventDefault: board.preventDefault,
    focus: board.focus,
  }
}

Cycle.run(main, {
  DOM: makeDOMDriver('#root'),
  websocket: createWebsocketDriver('http://localhost:3000'),
  focus: createFocusDriver(),
  preventDefault: (event$: Stream<Event>) => {
    event$.addListener({
      next: (e) => e.preventDefault(),
      error: (err) => console.error(err),
      complete: () => {}
    })
    return {}
  },
})
开发者ID:JamesHageman,项目名称:xstream-scrumbler,代码行数:30,代码来源:index.ts


示例8: main

import xs from "xstream";
import {run} from "@cycle/xstream-run";
import {makeDOMDriver, h1} from "@cycle/dom";



function main() {
	const sinks = {
		DOM: xs.periodic(1000).map(i => h1('' + i + " seconds elapsed"))
	};
  return sinks;
}

const drivers:{[name:string]: Function} = {
	DOM: makeDOMDriver("#app")
}

run(main, drivers);

开发者ID:udondokodoon,项目名称:touchevents,代码行数:18,代码来源:main.ts


示例9: run

console.clear();
import {Observable} from 'rxjs';
import {run} from '@cycle/rxjs-run';
import {div, input, li, hr, h1, button, b, br, span, ul, label, makeDOMDriver} from '@cycle/dom';
import {makeHTTPDriver} from '@cycle/http';
import * as $ from 'jquery';

run(main, {DOM: makeDOMDriver('#app'), HTTP: makeHTTPDriver()});

function main(sources) {
  const loadButton$ = sources.DOM.select('button').events('click')
    .startWith(null);
  const searchInput$ = sources.DOM.select('#search').events('input');

  const search$ = searchInput$
    .map(evt => evt.target.value)
    .startWith('');

  const request$ = loadButton$
    .mapTo({
      url: eldenStream(),
      method: 'GET',
      headers: {
        'Content-Type': 'application/json; charset=utf-8',
        'Access-Control-Allow-Origin': '*',
      },
      category: 'eldenStream'
    })
    ;

  const products$ = sources.HTTP
开发者ID:wizardwerdna,项目名称:CycleSimpleFormExample,代码行数:31,代码来源:boilerplate.ts


示例10: run

import {makeDOMDriver} from '@cycle/dom';
import {run} from '@cycle/rxjs-run';

import {BOAT_HOST, BOAT_PORT} from '../../constants';
import {Settings} from '../components/Settings';
import {makeUdpDriver} from '../drivers/broadcast';

run(Settings, {
    dom: makeDOMDriver(`#app`),
    wireless$: makeUdpDriver(BOAT_HOST, BOAT_PORT),
});
开发者ID:LakeMaps,项目名称:hangashore,代码行数:11,代码来源:settings.ts



注:本文中的@cycle/dom.makeDOMDriver函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript dom.mockDOMSource函数代码示例发布时间:2022-05-28
下一篇:
TypeScript dom.li函数代码示例发布时间:2022-05-28
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap