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

TypeScript react-plugin.createPlugin函数代码示例

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

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



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

示例1: getNewPluginName

export function getMethodsOf<Spec extends PluginSpec>(
  pluginName: Spec['name']
) {
  const name = getNewPluginName();
  createPlugin({ name }).register();

  return getPluginContext(name).getMethodsOf<Spec>(pluginName);
}
开发者ID:skidding,项目名称:cosmos,代码行数:8,代码来源:plugin.ts


示例2: mockPlug

export function mockPlug(
  slotName: string,
  component: PlugComponentType<any, any>
) {
  const name = getNewPluginName();
  const testPlugin = createPlugin({ name });
  testPlugin.plug(slotName, component);
  testPlugin.register();
}
开发者ID:skidding,项目名称:cosmos,代码行数:9,代码来源:plugin.ts


示例3: onServerMessage

import { createPlugin, PluginContext } from 'react-plugin';
import { Message } from 'react-cosmos-shared2/util';
import { BuildMessage } from 'react-cosmos-shared2/build';
import { MessageHandlerSpec } from './../MessageHandler/public';
import { NotificationsSpec } from './../Notifications/public';
import { BuildNotificationsSpec } from './public';

type Context = PluginContext<BuildNotificationsSpec>;

const { on, register } = createPlugin<BuildNotificationsSpec>({
  name: 'buildNotifications'
});

on<MessageHandlerSpec>('messageHandler', {
  serverMessage: onServerMessage
});

export { register };

function onServerMessage(context: Context, msg: Message) {
  const { getMethodsOf } = context;
  const notifications = getMethodsOf<NotificationsSpec>('notifications');

  const buildMsg = msg as BuildMessage;
  switch (buildMsg.type) {
    case 'buildStart':
      return notifications.pushStickyNotification({
        id: 'build',
        type: 'loading',
        title: 'Rebuilding...',
        info: 'Your code is updating.'
开发者ID:skidding,项目名称:cosmos,代码行数:31,代码来源:index.ts


示例4: getConnectedRendererIds

import { setFixtureState } from './setFixtureState';
import { receiveResponse } from './receiveResponse';
import { onRouterFixtureChange } from './onRouterFixtureChange';
import { RendererCoreSpec } from './public';
import { Context } from './shared';

const { on, register } = createPlugin<RendererCoreSpec>({
  name: 'rendererCore',
  initialState: {
    connectedRendererIds: [],
    primaryRendererId: null,
    fixtures: {},
    fixtureState: {}
  },
  methods: {
    getConnectedRendererIds,
    getPrimaryRendererId,
    getFixtures,
    getFixtureState,
    isRendererConnected,
    isValidFixtureSelected,
    setFixtureState,
    selectPrimaryRenderer,
    receiveResponse
  }
});

on<RouterSpec>('router', { fixtureChange: onRouterFixtureChange });

export { register };

function getConnectedRendererIds({ getState }: Context) {
开发者ID:skidding,项目名称:cosmos,代码行数:32,代码来源:index.ts


示例5: onRendererResponse

import { createPlugin, PluginContext } from 'react-plugin';
import { Message } from 'react-cosmos-shared2/util';
import { WebpackRendererResponse } from 'react-cosmos-shared2/webpack';
import { RendererCoreSpec } from './../RendererCore/public';
import { NotificationsSpec } from './../Notifications/public';
import { WebpackHmrNotificationSpec } from './public';

type Context = PluginContext<WebpackHmrNotificationSpec>;

const { on, register } = createPlugin<WebpackHmrNotificationSpec>({
  name: 'webpackHmrNotification'
});

on<RendererCoreSpec>('rendererCore', {
  response: onRendererResponse
});

export { register };

function onRendererResponse(context: Context, msg: Message) {
  const { getMethodsOf } = context;
  const notifications = getMethodsOf<NotificationsSpec>('notifications');

  const rendererResponse = msg as WebpackRendererResponse;
  switch (rendererResponse.type) {
    case 'rendererHmrFail':
      notifications.pushTimedNotification({
        // This event could potentially be triggered by multiple renderers at
        // once, but it only makes sense that hot reloading should fail the same
        // in all of them. To prevent duplicating this error in such cases the
        // notification ID is _not_ unique per renderer.
开发者ID:skidding,项目名称:cosmos,代码行数:31,代码来源:index.ts


示例6: subscribeToLocationChanges

import {
  UrlParams,
  getUrlParams,
  pushUrlParams,
  subscribeToLocationChanges
} from '../../shared/url';
import { RouterSpec } from './public';

type Context = PluginContext<RouterSpec>;

const { onLoad, register } = createPlugin<RouterSpec>({
  name: 'router',
  initialState: {
    urlParams: {}
  },
  methods: {
    getSelectedFixtureId,
    isFullScreen,
    selectFixture,
    unselectFixture
  }
});

onLoad(context => {
  const { setState } = context;
  setState({ urlParams: getUrlParams() });

  return subscribeToLocationChanges((urlParams: UrlParams) => {
    const { fixtureId } = context.getState().urlParams;
    const fixtureChanged = !isEqual(urlParams.fixtureId, fixtureId);

    setState({ urlParams }, () => {
开发者ID:skidding,项目名称:cosmos,代码行数:32,代码来源:index.ts


示例7: loadCache

import * as localForage from 'localforage';
import { PluginContext, createPlugin } from 'react-plugin';
import { StorageSpec } from './public';

type Context = PluginContext<StorageSpec>;

const { register } = createPlugin<StorageSpec>({
  name: 'storage',
  initialState: {
    cache: null
  },
  methods: {
    loadCache,
    getItem,
    setItem
  }
});

export { register };

async function loadCache(context: Context, projectId: string) {
  const items = (await localForage.getItem(getProjectKey(projectId))) || {};
  context.setState({ cache: { projectId, items } });
}

function getItem(context: Context, key: string) {
  const { cache } = context.getState();
  if (!cache) {
    throw new Error(`Can't retrieve item "${key}" before loading storage`);
  }
开发者ID:skidding,项目名称:cosmos,代码行数:30,代码来源:index.ts


示例8:

export function mockMethodsOf<Spec extends PluginSpec>(
  pluginName: Spec['name'],
  methods: Partial<MethodHandlers<Spec>>
) {
  createPlugin<any>({ name: pluginName, methods }).register();
}
开发者ID:skidding,项目名称:cosmos,代码行数:6,代码来源:plugin.ts



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


鲜花

握手

雷人

路过

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

请发表评论

全部评论

专题导读
上一篇:
TypeScript react-plugin.loadPlugins函数代码示例发布时间:2022-05-25
下一篇:
TypeScript resolveAssetSource.default函数代码示例发布时间:2022-05-25
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

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

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

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