Articles of reactjs

onClick处理程序不注册ReactDOMServer.renderToString

我试图复制这个小提琴: http : //jsfiddle.net/jhudson8/135oo6f8/ (我也试过这个例子http://codepen.io/adamaoc/pen/wBGGQv和存在相同的onClick处理程序问题) 并使用ReactDOMServer.renderToString使小提琴工作服务器端渲染 我有这个电话: res.send(ReactDOMServer.renderToString(( <html> <head> <link href={'/styles/style-accordion.css'} rel={'stylesheet'} type={'text/css'}></link> </head> <body> <Accordion selected='2'> <AccordionSection title='Section 1' id='1'> Section 1 content </AccordionSection> <AccordionSection title='Section 2' id='2'> Section 2 content </AccordionSection> <AccordionSection title='Section 3' id='3'> Section 3 content </AccordionSection> </Accordion> </body> </html> ))); Accordion元素看起来像这样: const React = require('react'); const fs = require('fs'); […]

React不会切换到生产模式

浏览器控制台警告: bundle.js:1警告:看起来您正在使用React的开发版本的缩小副本。 将React应用程序部署到生产环境时,请确保使用跳过开发警告的生产构build,并且速度更快。 有关更多详细信息,请参阅http://facebook.github.io/react/downloads.html 。 来自package.json的脚本: "scripts": { "start": "if-env NODE_ENV=production && npm run start:prod || npm run start:dev", "start:dev": "webpack-dev-server –inline –content-base public/ –history-api-fallback", "start:prod": "webpack && node server.js" }, 在Git Bash中的命令: NODE_ENV=production npm start 如果我在server.js使用console.log(process.env.NODE_ENV) ,那么我得到了production 。 React 通过 npm安装 最新版本:15.0.2 我使用Webpack的UglifyJs插件 任何想法可能是错的? 从第一个引号的链接: 注意:默认情况下,React将处​​于开发模式。 要在生产模式下使用React,请将环境variablesNODE_ENV设置为生产(使用envify或webpack的DefinePlugin)。 build议使用UglifyJS等执行死代码清除的清除器来完全删除开发模式中存在的额外代码。 我错过了什么吗? 我真的需要某种第三方包或插件来设置variables吗? 但它已经控制日志,它是在生产环境..对我来说似乎不符合逻辑。 更新:当前的webpack.config.js var webpack […]

React Native中的zIndex

如何处理zIndex? 我试图从scrollview中指定最大的数字,但它仍然在底部( 没有ScrollView它看起来像这样,但我需要滚动到图像。 谢谢

从React(同构应用程序)进行API调用时出现“Access-Control-Allow-Origin”问题

我遇到了使用React和Express的同构JavaScript应用程序的问题。 我正在尝试使用axios.get在组件装入时发出HTTP请求 componentDidMount() { const url = 'http://ufc-data-api.ufc.com/api/v3/iphone/fighters/title_holders'; axios.get(url).then( res => { //use res to update current state }) } 我从API获取状态200 res,但我没有得到任何响应数据,并在我的控制台中得到一个错误 XMLHttpRequest cannot load http://ufc-data-api.ufc.com/api/v3/iphone/fighters/title_holders. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. 但是,如果我在我的server.js中发出请求 const url = 'http://ufc-data-api.ufc.com/api/v3/iphone/fighters/title_holders'; axios.get(url).then(res => { //console.log(res); }); 它工作正常,我得到服务器启动时的响应数据。 这是一个与实际的API问题,或者我做错了什么? 如果这是一个CORS问题,我猜在server.js中的请求也不会工作吗? […]

使用Webpackcaching索引源代码中的值,使用React.js

我正在构build一个同构的应用程序。 它是完全用反应build立起来的 – 也就是说,html基础也在起作用。 我有我的根html作为一个应用程序组件。 它看起来像这样: … var AppTemplate = React.createClass({ displayName: 'AppTemplate', render: function() { return ( <html> <head lang="en"> <title>hello</title> <link rel="stylesheet" href='/css/style.css' /> </head> <body> <RouteHandler {…this.props}/> <script type='text/javascript' src='/js/bundle.js' /> </body> </html> ); } }); … module.exports = AppTemplate; 当我使用webpack构build项目时,我需要replacejs / bundle.js来包含哈希。 Webpack在完成后提供stats.json。 但是我需要在构build期间提供散列。 我正在考虑使用function标志来做这样的事情: … var AppTemplate = React.createClass({ displayName: […]

从节点传递或使用process.envvariables到reactjs

如何从节点传递或使用process.envvariables到reactjs? 例如,我有这个 const nodeEnv = process.env.NODE_ENV || 'development' 在我的发展和运作(我认为是因为它的发展,我有一个后备'development' 。 但是,当我们把它推到我们的登台服务器并设置NODE_ENVvariables时,它只在第一次加载时才起作用,但随后不起作用。 我想我得到这个,因为起初它是由节点服务的,它可以访问服务器variables,但事后它将反应服务页面(正确?),它将无法访问服务器的东西。 那么我怎样才能得到variables来反应,而不用硬编码呢(因为我们最终会有一个不同的生产集合)? 编辑。 如果有差异,我们也使用webpack。

使用react-router和webpack响应改变的URL给页面找不到错误

我有以下webpackconfiguration文件: var webpack = require('webpack'); var path = require('path'); var BUILD_DIR = path.resolve(__dirname, 'src/client/public'); var APP_DIR = path.resolve(__dirname, 'src/client/app'); var config = { entry: [ APP_DIR + '/config/routes.jsx', 'webpack/hot/dev-server', 'webpack-dev-server/client?http://localhost:8080' ], output: { publicPath: 'http://localhost:8080/src/client/public/' }, module : { loaders : [ { test: /\.jsx?$/, loader: 'babel-loader', include: APP_DIR, exclude: /node_modules/, query: { presets: ['es2015'] […]

如何使用ReactJS / NodeJS一起部署到Amazon Web Services(AWS)上?

我目前在一个项目下有ReactJS + NodeJS / ExpressJS + Webpack到EC2,amazon web services(AWS),并希望在一个项目中一次部署它。 有什么build议如何去做呢? 完成研究,我只看到了关于如何部署一个教程的教程,无论是ReactJS还是仅仅是NodeJS。 任何见解或潜在客户将不胜感激。 将接受/ upvote答案。 先谢谢你

在React中没有使用ES6获取来定义获取方法

嘿家伙我有我的第一个反应js应用程序中获取函数的麻烦。 这是我的项目的结构: hello-world — app — components — main.jsx — node_modules — public — build.js — index.html — package.json 这是我用npm安装的: npm install react react-dom babel-core babel-loader babel-preset-es2015 babel-preset-react webpack –save-dev npm install –save isomorphic-fetch es6-promise 我使用webpack webpack.config module.exports = { entry: './app/components/main.jsx', output: { path: './public/', filename: "build.js", }, module: { loaders: [ { exclude: […]

Karmaunit testing:模块名称“react”尚未加载上下文:_。 使用require()

我正在尝试设置unit testing框架进行反应。 这样做时发生以下错误。 我已经search了所有的互联网没有解决scheme正在工作。 下面是显示的错误和我正在使用的代码/包。 debugging错误 04 03 2016 04:48:46.340:DEBUG [phantomjs.launcher]: Error: Module name "react" has not been loaded yet for context: _. Use require([]) http://requirejs.org/docs/errors.html#notloaded 04 03 2016 04:48:46.341:DEBUG [phantomjs.launcher]: http://localhost:9876/base/node_modules/requirejs/require.js?6f53c895855c3743ac6fb7f99afc63ca5cdfd300:140 in defaultOnError http://localhost:9876/base/node_modules/requirejs/require.js?6f53c895855c3743ac6fb7f99afc63ca5cdfd300:544 in onError http://localhost:9876/base/node_modules/requirejs/require.js?6f53c895855c3743ac6fb7f99afc63ca5cdfd300:1429 in localRequire http://localhost:9876/base/node_modules/requirejs/require.js?6f53c895855c3743ac6fb7f99afc63ca5cdfd300:1791 in requirejs PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR Error: Module name "react" has […]