Articles of reactjs

React w / SignalR – TypeError:WebSocketClient()不是一个构造函数

React开发新function 我正在为BitTrex Exchange API构build一个API客户端,使用它们的node.js包装器: node.bittrex.api 为了在ReactJS框架中简单地testing订单更新的websocket订阅,下面是我采取的步骤: – 使用创build反应 – 应用程序来创build应用程序。 -used npm安装node.bittrex.api – 将bittrex客户端对象添加到默认App.js组件的顶部,并使用适当的API密钥configuration选项 – 添加一个button(与处理程序绑定到buttonReact文档)到默认的App.js主要组件, 在处理函数中,根据node.bittrex.api文档中的示例代码启动websocket订阅。 该应用程序出现了,但是当我按下button,我得到一个错误,说TypeError Websocketclient()不是一个构造函数,在创buildwebsocket连接的SignalR.js中的行: 现在我怀疑只有一些与React框架有关的东西正在搞砸了。 任何人都可以帮助我理解错综复杂的东西吗? 谢谢。 这是我的App.js: import React, { Component } from 'react'; import logo from './logo.svg'; import './App.css'; var bittrex = require('../node_modules/node.bittrex.api/node.bittrex.api.js'); bittrex.options({ 'apikey' : process.env.REACT_APP_BTREX_API_KEY, 'apisecret' : process.env.REACT_APP_BTREX_SECRET_KEY, 'verbose' : true, 'cleartext' : false, 'baseUrl' : […]

React + Express + Nodemailer:无法将组件和Nodemailer渲染在一起

我想使用客户端路由来呈现我的React应用程序,并且想要使用Nodemailer发送邮件。 由于Nodemailer不能在客户端使用,我必须在Express服务器上实现此function。 这就是服务器的样子: express.js router.use(express.static(path.resolve(__dirname, '..', 'build'))) router.get('*', (req, res) => { res.sendFile(path.resolve(__dirname, '..', 'build/index.html')) }) router.get('/sendmail', (req, res) => { transporter.sendMail(options, (error, info) => { if (error){ console.log(error) } console.log('Message was send!') }) }) 1)所以这呈现了React组件,但是当我路由到'/ sendmail'时显示一个空白页面,index.html被渲染为没有js,并且没有邮件被发送。 2)如果我删除第一行router.use(express.static…并路由到'/ sendmail'邮件被发送,但我的应用程序不会呈现。 另外我已经尝试了以下内容: router.use(express.static(path.resolve(__dirname, '..', 'build'))) router.get('*', (req, res) => { console.log('path', req.path) if (req.path === '/sendmail') { […]

如何使webpack dev服务器访问公开?

https://github.com/nttcom/SkyWay-MultiParty我testing了这个api在本地运行webpack dev服务器 这是成功,但我想访问其他电脑或智能手机 我能做什么? 我第一次看到webpack代码 的package.json { "name": "skyway-multiparty", "version": "1.0.4", "description": "SkyWay js library for multi party apps", "homepage": "https://github.com/nttcom/SkyWay-MultiParty", "repository": { "type": "git", "url": "git://github.com/nttcom/SkyWay-MultiParty.git" }, "main": "lib/index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "webpack-dev-server": "webpack-dev-server –host 172.19.1.200 –port 8081 –open –https –content-base ./" }, webpack.config.js const webpack […]

试图根据选定的选项显示字段

我有团队和竞争的注册部分,但是我想要做的是当用户select比赛时,我想显示促销代码字段,并且只有在select了比赛时显示该字段,如果select了团队,它将不会显示促销领域,谢谢提前。 React.Component { constructor(props) { super(props); this.state = {name: '', email: '', password: ''}; } handleChange(event) { this.setState({ [event.target.name]: event.target.value }); } handleSelect(event, index, value) { this.setState({type: value}); } handleSignup(event) { event.preventDefault(); this.props.dispatch(signup(this.state.name, this.state.email, this.state.password, this.state.promo, this.state.type)); } render() { return ( <div className="login"> <div className="panel"> <div className="body"> <legend>Create an account</legend> <SelectField floatingLabelText="User or Admin" […]

我正在使用来自NPM的unsplash-js api

我在我的反应项目中使用了unsplash-js,当我使用search查询获取一些随机照片时,我在下面的JSON检查中得到了返回结果。 {total: 303, total_pages: 31, results: Array(10)} results:Array(10)0:{id:“nitdfruLYys”,created_at:“2016-10-12T13:04:23-04:00”,updated_at:“2017-08-02T04:08:11-04:00” ,width:4000,height:6000,…} 1:{id:“XE87arvN3oo”,created_at:“2015-12-12T11:43:35-05:00”,updated_at:“2017-08-02T12:08:22 -04:00“,width:4272,height:2848,…} 2:{id:”iS0Aq3QPsJ4“,created_at:”2016-02-26T19:51:15-05:00“,updated_at:”2017-08- 02T16:36:55-04:00“,width:3000,height:1691,…} 3:{id:”41eXcLghVhI“,created_at:”2017-07-15T20:50:43-04:00“,updated_at: 4:{id:“EjlygRQAOik”,created_at:“2017-02-07T19:59:18-05: 00“,updated_at:”2017-08-02T00:30:17-04:00“,width:5000,height:3333,…} 5:{id:”WicMLrOSVvY“,created_at:”2015-10-24T13:40 :06-04:00“,updated_at:”2017-07-31T07:00:30-04:00“,width:3456,height:2304,…} 6:{id:”Fu8pblIzEL0“,created_at: 03-06T16:49:09-05:00“,updated_at:”2017-08-01T20:41:35-04:00“,width:4928,height:3264,…} 7:{id:”D9XX 3Cjoh2s“,created_at:”2016-02-21T15:45:25-05:00“,updated_at:”2017-08-02T20:44:56-04:00“,width:6000,height:4000,…} 8 :{id:“Aka2x2D4Ph0”,created_at:“2016-01-21T03:42:02-05:00”,updated_at:“2017-07-28T10:24:12-04:00”,width:5616,height: 3744,…} 9:{id:“E-1tnSNP0y4”,created_at:“2015-11-08T19:32:31-05:00”,updated_at:“2017-07-30T17:19:06-04:00” ,width:5472,height:3648,…} length:10 proto :Array(0)total:303 total_pages:31 proto :Object 我需要设置这个状态作为一个数组,但是当我在我的代码中设置我得到这个错误:对象是无效的作为一个React的孩子 this.setState({photos:json});

反应路由器不能得到页面

我正在使用反应与快递使用networking包,但反应路由器DOM创build一个错误,即空匹配问题。它不能得到的页面和匹配是空的。 我的路线页码是:routes.js import React from 'react'; import ReactDOM from 'react-dom'; import { BrowserRouter as Router, Route} from 'react-router-dom'; import App from './App.js'; import language from './language.js'; import Page from './Page.js'; const Routes = () => ( <Router> <div> <Route path='/' component={App} /> <Route path='/page' component={Page} /> <Route path='/language' component={language} /> </div> </Router> ) console.log(typeof Routes) […]

使用jsonwebtoken创buildReact-App DNS模块错误

我有一个错误,我无法解码客户端应用程序的授权令牌。 我发现我的问题的修复程序,但他们只能被固定在自定义webpack.configs。 我正在使用create-react-app构build,现在已经停留了一段时间了。 这里是我的错误是一个例子。 ./~/isemail/lib/isemail.js Module not found: Can't resolve 'dns' 当我尝试在客户端使用npm模块“jsonwebtoken”解码我的授权令牌时,会发生此错误。 如果任何人有一个解决这个问题或可以解释一种方法来初始化dns节点为空,我将不胜感激

来自React的快速POST请求返回空主体

你好,我正在做一个反应/expression应用程序。 我已经能够从我的服务器发出GET请求,但是,我无法发出POST请求。 当我这样做,我的服务器正在返回一个空的身体。 我有身体分析器作为依赖,接受JSON作为内容,但仍然没有运气与空的身体。 我的代码和服务器/客户端的依赖关系如下。 请让我知道,如果你们看到我不。 Index.js const express = require('express'); const path = require('path'); const app = express(); const bodyParser = require('body-parser'); //routes require('./routes/sendMessageToEmail')(app); require('./routes/helloWorld')(app); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); app.use(express.static(path.join(__dirname, 'client/build'))); app.get('*', (req, res) => { res.sendFile(path.join(__dirname+'/client/build/index.html')); }); const port = process.env.PORT || 1111; app.listen(port); 例如,当我在我的index.js文件中声明路由的地方切换命令时,在之后声明路由行 app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); 行,我得到一个不确定的反对一个空的身体。 邮政路线 […]

我可以连接到部署在应用程序引擎上的从本地主机部署mongoDB的谷歌云,但不能从同一个应用程序

我的应用程序是使用Mongoose为数据库编写的React和Express。 我在Google计算引擎上部署了一个bitnami mongoDB实例。 现在我试图在App引擎上部署服务器。 当我在本地运行我的应用程序,它可以很好地连接到数据库(我可以添加的东西,看看它)。 但是,当我做一个npm开始在谷歌云壳得到这个错误: 'failed to connect to server [35.196.182.249:27017] on first connect [MongoError: connection 0 to 35.196.182.249:27017 timed out]' } (node:1310) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): MongoError: failed to connect to server [35.196.182.249:27017] on first connect [MongoError: connection 0 to 35.196.182.249:27017 timed out] 这是我的代码连接: mongoose.connect(process.env.MONGODB_URI,{ useMongoClient: true }).catch(function(err){ console.log(err) }); […]

React Native / Node API:在发送之后无法设置标题

我遇到了一个与我的Node API交互的原生应用程序的问题。 当我尝试发布数据通过节点更新数据库中的某些值(然后转到存储过程)时,我得到一个500 – 在Node 中发送后,无法设置标题 。 我能find的所有东西都表示这可能是由于发送了两次响应。 我不认为这是这种情况。 我已经在邮递员testing,事情工作正常,它返回正确的返回数据200的状态。 我正在尝试将数据发布到API,如下所示: const myHeaders = new Headers(); myHeaders.append('Content-Type', 'application/json'); fetch(`http://localhost:3000/user/preferences`, { method: 'POST', headers: myHeaders, mode: 'cors', cache: 'default', body: JSON.stringify({ id: '1', minage: this.state.minageValue, maxage: this.state.maxageValue }) }) .then(response => response.json()) .then(body => console.log(body)) .catch(err => console.log(err)); 我在API端接收数据,并将数据传递给存储过程: function updatePreferences(req, res, next) { console.log(req); var […]