Tag: flux
如何从通用的JavaScript引用一个React类
我有这个index.html： <html> <head> <title>Sample App</title> <link href="./src/css/bootstrap.min.css" rel="stylesheet" /> <link href="./src/css/bootstrap.dashboard.css" rel="stylesheet"> </head> <body> <div id='root'> </div> <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script> <script type="text/javascript" src="./src/js/jquery.signalR-2.2.0.min.js"></script> <script src="http://localhost:26665/signalr/hubs"></script> <script type="text/javascript" src="/static/bundle.js"></script> <script type="text/javascript"> $(function() { var myHub = $.connection.signalRTwitchBotParserHub; myHub.client.OnNewMessage = function (data) { // Call AppActions.dispatchMessage(message); }; $.connection.hub.url = "http://localhost:26665/signalr"; $.connection.hub.start() }); </script> </body> 我怎样才能从那里调用一个React创build的类？ 我想代替// Call […]
TypeError：require不是Object.module.exports.map的函数
同时编译节点的js项目与gulp命令下面的错误发生。 在public / js / app / app.node.js中： var fs = require('fs'); ^ TypeError： require不是 Object.module.exports.map ../文件中的函数 我试图用当前的项目实现反应streamapi调用。 更新： 这个错误在添加后已被删除 new dwebpack.DefinePlugin({ "global.GENTLY": false }) 但目前下面的错误发生。 return binding.open(pathModule._makeLong(path), stringToFlags(flags), mode); ^ Error: ENOENT: no such file or directory, open '/types/mime.types' at Error (native) at Object.fs.openSync (fs.js:549:18) at Object.fs.readFileSync (fs.js:397:15) at Mime.load
不能用alt动作触发alt存储（Flux）
我正在用goatslacker / alt开发stream量前端程序。 我有问题触发商店更新与行动。 听众不像我预料的那样运作。 我正在处理的代码现在非常复杂。 我会尽量简化我的问题到下面的代码。 我期待它最后login“Hello World！msg：Some message”。 显然，listener hello()甚至没有运行。 这是要运行的主要JavaScript（ES6）文件： import alt from './alt'; class DummyActionsProto { sayHello(msg) { console.log("sayHello", msg); return {msg} } } var DummyActions = alt.createActions(DummyActionsProto); class DummyStoreProto { constructor() { this.bindListeners({ hello: DummyActions.sayHello, }); this.state = { items: [], }; } hello(msg) { console.log("Hello World! msg: "+msg); } […]
为什么Dispatcher在Flux上启动不必要的事件？
我有一个React / Flux应用程序，其中包含以下组件： header.js subnav-area.js 饲料area.js 我也有相应的商店： navbar-store.js（header） subnav-store.js 饲料store.js …和行动： navbar-actions.js（header） subnav-actions.js 饲料actions.js 当按下subnav上的一个button时，feed和subnav都应该被更新，设置正确的进给types并突出显示激活的subnav元素。 我成功地实现了这个目标，但是我也多次启动一个onChange事件，同样也使用header.js组件，尽pipe它不应该受到这个动作的影响。 在行动中，我打电话给这样的调度员： AppDispathcer.handleViewAction({ actionType: AppConstants.SUBNAV_SET_ACTIVE, _id: subnavItemId }) 当然，这取决于目的。 我的调度员看起来像这样： handleViewAction：function（action）{ this.dispatch（{source：'VIEW_ACTION'，action：action}）} 在店里我有这样的事情来处理调度员： dispatcherIndex: AppDispatcher.register(function(payload) { var action = payload.action; switch(action.actionType) { case AppConstants.FILTER_SET_CAT: FeedStore.selectVisibleFeedItems(); break; case AppConstants.FEED_SHOW_MORE: FeedStore.showMoreItems(filterCatName); break; } FeedStore.emitChange(); return true; }) 所有组件都具有以下function（但具有不同的侦听器名称）： componentWillMount:function(){ FeedStore.addFeedListener(this._onChange, 'feed-area.js'); }, […]
如何使用.net MVC的Flux和事件发射器？
我正在学习Flux模式。 我学会了使用.net MVC的React并将其呈现在服务器端。 我想学习Flux，但所有教程都使用节点js。 我不使用节点。 我不知道如何实现Event Emitter部分，因为它使用了一个节点函数。 https://www.codementor.io/reactjs/tutorial/react-js-flux-architecture-tutorial 大约三分之一的下降： “事件发射器 – 事件发射器负责在存储完成任何数据动作之后通知订阅者，反之，它也需要能够注册观察者以用于特定的事件，我们将在待办事项应用程序中使用Node的事件发射器“。 考虑到Flux只是一个模式，是否有什么我可以使用.NET MVC，在没有节点，处理事件发射器的一部分？ 感谢赞赏，谢谢。
React Flux调度器vs Node.js EventEmitter – 可扩展？
当你使用Node的EventEmitter时，你订阅一个事件。 您的callback仅在特定事件启动时执行： eventBus.on('some-event', function(data){ // data is specific to 'some-event' }); 在Flux中，您向调度员注册您的商店，然后当每个事件被调度时，您的商店被调用。 商店的任务是过滤每一个事件，并确定事件对商店是否重要： eventBus.register(function(data){ switch(data.type){ case 'some-event': // now data is specific to 'some-event' break; } }); 主持人在录像中说： 实际上，所有商店都会收到所有的动作，这就是保持可扩展性的原因。“ 题 为什么以及如何向每个商店发送每个动作（大概）比只向特定商店发送动作更具可扩展性？
同构JS – 只有httpRequest客户端
关于同构stream量应用中商店数据总量的问题。 （我正在使用的反应，ALT，ISO和节点，但理论适用于其他的例子） 我有一个stream量'商店'（ http://alt.js.org/docs/stores/ ），需要从api获取数据： getState() { return { data : makeHttpRequest(url) } } 当用户在SPA中导航时，更多的数据将通过http请求加载。 我希望这个应用程序是同构的，以便我可以呈现应用程序完整的HTML包括最新的数据服务器端，并返回给用户的快速初始页面加载。 react.renderToString（）允许我将应用程序呈现为html，并且可以使用alt＆iso来播种数据： storeData = { "MyStore" : {"key" : "value"}}; // set data for store alt.bootstrap(JSON.stringify(storeData || {})); // seed store with data var content = React.renderToString(React.createElement(myApp)); // render react app to html 问题是，当运行js服务器端时，我会看到错误，因为商店将要发出一个http请求，这是不可能的（因为xmlhttprequest不会存在于节点中） 什么是解决这个问题的最好方法？ 我能想到的唯一解决scheme是将商店中的httprequest包装在： var ExecutionEnvironment = require('react/lib/ExecutionEnvironment'); […]
Flux / Alt数据依赖，如何优雅和惯用地处理
我使用alt作为项目的stream量实现，并且在处理两个相关实体的加载存储的最佳方法时遇到了麻烦。 我使用源特性与registerAsync一起处理我的asynchronous/ api调用，并使用AltContainer将它们绑定到我的视图。 我有两个由conversationId相互关联的实体。 两者都通过api调用加载： 一旦我的工作商店加载数据，我想填补一个对话商店。 我使用源来加载作业存储： module.exports = { fetchJobs() { return { remote() { return axios.get('api/platform/jobs'); },…. 看起来像waitFor（）方法的工作，但它似乎用于一个商店的内容需要转换或合并与另一个的内容。 我需要根据另一个数据的内容获取一个数据存储的内容。 一般而言，我需要： 调用第三方API并将实体列表加载到商店中。 当数据到达时，我需要使用上述每个属性来调用另一个API并将该数据加载到另一个存储中。 我天真的解决scheme是参考作业存储中的对话操作，并在数据到达时分派事件。 像这样的东西： var jobActions = require('../actions/Jobs'); var conversationActions = require('../actions/Conversations'); class JobStore { constructor() { this.bindListeners({ handlefullUpdate: actions.success });… } handlefullUpdate(jobs) { this.jobs = jobs; conversationActions.fetch.defer(jobs); } } 当然，这样做违反了商店不应该派遣事件的格言，因此我必须使用推迟在派遣中间派遣一个行动。 这对我来说是有意义的，因为它似乎在走下去，我在我的代码中重新引入各种副作用; 失去了我应该看到的“function性pipe道”的美感。 […]
