Tag: reactjs

将数据从React发送到Node服务器，并将结果发送到React: 我如何将数据从React发送到Node服务器，然后将结果发送到React。我对表单有反应，并且有一些数据，我想把这个数据发送到节点服务器，把这个数据改回这个数据并返回结果。反应代码： var Exp = React.createClass({ getInitialState: function () { return {count: ""}; }, handleChange: function (event) { this.setState({count: event.target.value}); }, render: function () { return <div> <h1>Count: {this.state.count}</h1> <form method="post"> <input type="text" onChange={this.handleChange}/> <button onClick={this._onChange}>Submit</button> </form> </div>; }, _onChange: function (event) { event.preventDefault(); console.log("count: " + this.state.count); }});React.render(<Exp />, document.getElementById('container')); 节点： var express […]

如何使用react-router 2来设置服务器端渲染: 我想移植我的应用程序，从1.0反应路由器2.0。我正在尝试做快递服务器端渲染。 server.js代码（1.0）（工作） var routes = require('./public/js/app.node.js'); app.get('*', function(req, res, next) { var location = new Location(req.path, req.query); try { Router.run(routes(), location, function(e, i, t) { var str = React.renderToString( React.createElement(Router, i)); }); } catch(e) { return next(); } }); server.js代码（2.0）（不工作） var routes = require('./public/js/app.node.js'); app.get('*', function(req, res, next) { var location = new Location(req.path, […]

react-router-redux：将路由参数映射到状态: 有没有办法自动映射路由参数到状态键？例如：我想将state.auth.resetEmail和state.auth.resetToken初始化为路由参数params.resetEmail params.resetToken只要这些路由参数可用。也许我以错误的方式接近这个？

使用transform更新集合中添加的道具的数据: 这是我堆栈溢出的第一个问题，所以请随时要求我更准确。我在meteor服务器上有一个MongoDB集合。使用transform选项，我添加了一个简单的可以切换的选定属性： Nodes = new Mongo.Collection("nodes", { transform : function(item) { item.selected = false; item.toggleSelected = function() { item.selected = !item.selected; } return item; } }); 我添加了一个函数toggleSelected因为我不能修改用meteor的Update函数select的属性（或者我可能不知道如何）。所以这给我带来了我显示Nodes列表的问题。在这个列表中，我可以select和取消select每个节点，当我select它时，我希望带有React的UI来更新自己，以便我们可以看到该节点被选中： Node = React.createClass({ propTypes: { node: React.PropTypes.object.isRequired, }, render() { return ( <li onClick={this.toggleSelected}> <span>{this.props.node.text}</span> <span className="single-node">Selected : {this.props.node.selected?"true":"false"}</span> </li> ); }, toggleSelected(){ this.props.node.toggleSelected(); } […]

Browserify包的输出非常大，找不到debugging进程的方法: 我正在使用npm的browserify来创build一捆js。该网站的应用程序使用反应和很多其他模块，所以输出文件约3.4M， 2M加粗和430K gzip。 browserify进程是通过package.json中定义的npm run browserify执行的 "browserify": "browserify client/index.js -u server/**/**/**/* -iq -i express-validation | uglifyjs -o public/javascripts/generated/bundle.js" 我有一种感觉，束输出是太大了，有一种方法来减less它，但我找不到一种方法来debugging进程（尝试-d –list等）。任何帮助将不胜感激。

是否有可能使用Webpack绑定节点库，所以导致的代码将与execjs工作？: 我的服务器端是轨道，我试图做同构呈现与反应和中继。我发现的唯一方法是使用npm模块同构中继。显然它使用节点获取，而这又是使用“http”库。是否有可能使用webpack（或其他工具）来创build包含所有代码的单个包，然后使用execjs（以Node作为引擎）运行它？当我使用节点作为目标webpack叶'http'作为外部需求，假设节点将加载它，所以execjs不能运行它… 细节：我的源文件是单行 require('isomorphic-fetch'); 使用webpackconfiguration： target: 'node', output: { path: path.join(__dirname, '..', 'public', 'webpack'), publicPath: '/webpack/', filename: 'server-bundle.js', libraryTarget: 'commonjs2' }, 结果包包括各种要求，如下所示： /* 3 */ /***/ function(module, exports) { module.exports = require("url"); /***/ }, /* 4 */ /***/ function(module, exports) { module.exports = require("http"); /***/ }, /* 5 */ /***/ function(module, […]

通过webpack和渲染编译之前，将一个参数从Express路由器传递给React: 我的项目在webpack.config.jsconfiguration如下： module.exports={ context: __dirname+'/src', entry:'./main.js', output:{ path:__dirname+'/static', filename:'bundle.js' }, module:{ loaders:[ { test:/\.png$/, loader:'url?limit=10000' }, { test:/\.jpg$/, loader:'url?limit=10000' }, { test:/\.css$/, loader:'style!css' }, { test: /\.jsx?$/, exclude: /(node_modules)/, loader: 'babel', query: { presets: ['react', 'es2015'] } } ] } } 在Express的服务器中，我写了一个这样的路由器： app.get('/',function(req,res){ res.render('index'); }); 这是从我的main.js呈现给客户端的逻辑： var React=require('react'); var ReactDOM=require('react-dom'); var Content=require('./index').Content; var style=require('../public/css/style.css'); var google=require('../public/images/btn_sign_in_google.png'); […]

relay-starter-kit在Windows上失败: 我在Windows 10机器上安装了重播入门工具包，但在“npm start”之后出现错误。关键的失败似乎是在“babel-node ./server.js”。这是我的npmdebugging日志： 0 info it worked if it ends with ok 1 verbose cli [ 'C:\\Program Files (x86)\\nodejs\\\\node.exe', 1 verbose cli 'C:\\Program Files (x86)\\nodejs\\node_modules\\npm\\bin\\npm-cli.js', 1 verbose cli 'start' ] 2 info using npm@2.11.2 3 info using node@v0.12.5 4 verbose run-script [ 'prestart', 'start', 'poststart' ] 5 info prestart relay-starter-kit@0.1.0 6 info […]

如何编译导入的ES6节点模块？: 我有一个用ES6编写的应用程序，我使用babel来转换该应用程序中的所有文件。这个应用程序还包括一个带有React组件的node_module（也是用ES6编写的）。我正在导入这样的组件： import { Box } from 'components/Box' 当我跑步 babel-node –presets es2015,stage-0,react 在导入Box组件的文件上，第1行的组件/ Box文件中出现错误： (function (exports, require, module, __filename, __dirname) { import React, { Component } from 'react' ^^^^^^ SyntaxError: Unexpected token import 我认为这是为什么发生的原因是因为babel-node不是在传输node_modules。这是有道理的，因为大多数节点模块是以commonjs格式编写的。有没有办法将这个特定的节点模块列入白名单，以便它可以被传输？

Reactjs req.body显示: 我在ReactJs中有一个http put函数，看起来像这样 UpdateItem: function(_id) { var input = this.refs.myInput; $.ajax({ url: 'http://localhost:3000/update/' + _id, type: 'PUT', data:input, cache: false, success: function(result) { console.log(data); window.location.reload(); } }); } 它需要一个input，它应该发送新的值与请求，但它永远不会 <input ref="myInput" type="number" name="quantity" min="1" max="10" defaultValue={item.quantity} className="form-control"/> 当我看着控制台req.body显示这个[对象对象]，我在节点中的put函数看起来像这样 app.put('/update/:_id', function(req, res) { console.log(req.params); console.log("your req is" +req.body); Cart.findByIdAndUpdate(req.params.id, { quantity: req.body.quantity }, function(err, product) { if […]