Tag: react jsx

渲染方法中意外的标记参数: 我试图启动Express.js服务器与我下载的反应的应用程序，但是当我做npm开始在我的服务器上有错误 ERROR in ./src/app.jsx Module build failed: SyntaxError: Unexpected token (6:7) 4 | import 'react-select/dist/react-select.css'; 5 | > 6 | render(<div>Place your application here</div>, document.getElementById('app-root')); 为什么会这样？

React + Gulp + Babelify: 我正尝试将我的工作应用程序从React和Gulp与ES5转换为React + Gulp和ES6。我只是试图用babelifyreplace反应，但我仍然得到吞咽错误：非法import声明这是我的gulpfile.js： "use strict"; var gulp = require('gulp'); var connect = require('gulp-connect'); //Runs a local dev server var open = require('gulp-open'); //Open a URL in a web browser var browserify = require('browserify'); // Bundles JS var source = require('vinyl-source-stream'); // Use conventional text streams with Gulp var concat = require('gulp-concat'); //Concatenates files […]

反应链接到function不起作用: 对不起，如果这是一个重复的问题。我似乎无法解决这个问题或find答案。我有一个基本的React路由器设置，我正在努力工作，我真的被困在让链接function工作。提前致谢。线框示例这是代码。 App.js import React from 'react' import reactDOM from 'react-dom' import { Router, Route, hashHistory, IndexRoute } from 'react-router' import About from "./About Us/About" import FrontPage from "./Front Page/FrontPage" import HeaderNavigation from './General/HeaderNavigation'; reactDOM.render(( <Router history = {hashHistory}> <Route path="/" component={FrontPage}> <IndexRoute component = {HeaderNavigation}/> <Route path="/About" component={About}/> </Route> </Router> […]

react-typeahead – 不变的违规：addComponentAsRefTo（…）问题: 节点v0.12.2 React v0.13.2 Npm v2.7.4 使用标准typeaheadinput会导致以下错误：未捕获错误：不变违例：addComponentAsRefTo（…）：只有ReactOwner可以有参考。这通常意味着你正在尝试向没有所有者的组件添加ref（也就是说，不是在另一个组件的render方法中创build的）。试着将这个组件放在一个新的顶层组件中，这个组件将会容纳参考。这就是我如何实现这一点… Index.jsx有： 'use strict' var React = require('react'); var ReactTypeahead = require('react-typeahead').Typeahead var QuickSearch = React.createClass({ render: function () { return( <ReactTypeahead options={["spam", "foodbar"]}/> ); } }); var Topbar = React.createClass({ render: function() { return ( <QuickSearch /> ); } }); module.exports = Topbar; 然后在我的App.jsx中我有： 'use […]

React – 服务器端组件呈现: 我试图renderToString一个非常简单的React组件在服务器上： /** @jsx dom */ var React = require("react"); var Title = React.createClass({ render: function(){ return(<h1>Hello World</h1>) } }); module.exports = React.createFactory(Title); 当我调用ReactDOMServer.renderToString（组件）时，我得到Error: Invariant Violation: renderToString(): You must pass a valid ReactElement. 如果我做React.createElement（标题），我得到 return(dom.h1(null, "Hello World")) ^ ReferenceError: dom is not defined 路线文件： var express = require('express'), router = express.Router(), React = require("react") ReactDOMServer = […]

为React模板化引擎？: 我正在构build我的第一个React应用程序，对于如何在Express中初始页面加载时传递数据，我有点困惑。我通常使用EJS partials并通过res.render（）传递数据对象。有没有一种解决scheme，使我可以轻松地将值放入页面加载的React道具，类似于EJS的方式？如果是这样，哪个是最好的select？到目前为止，我刚刚从componentDidMount（）发送了一个AJAX，这是我很好（我假设不理想，但它的工作），但我现在正在build立一个“文章”页面与一个variables的URL ID，我需要传入数据库查询，以便我可以接收关联的数据。

如何将上下文传递给React / jsx视图？: 我是React新手，我正在努力弄清楚一些基础知识。在其他模板引擎（如EJS或Jade）中，当您在路由/控制器文件中呈现视图文件时，您可以传入上下文variables。但是，我还没有find任何方式与React / jsx做到这一点。我应该注意到我正在使用Express。我实际上是不确定的，如果jsx是一个视图引擎，或者如果React莫名其妙内置。无论如何，我不知道如何将上下文从服务器传递到视图文件。例如，如果我想加载configuration文件信息（存储在服务器/后端），我怎样才能把它传递给我的前端jsx视图文件在React / jsx？

在React代码中导入superagent时出错: 我有一个用JSX编写的NodeJS服务器代码，我在这里导入superagent： import request from 'superagent'; 当服务器启动后生成，我得到以下错误：TypeError：require不是一个函数。这发生在我编译的代码中的以下行： var crypto = require('crypto'); 在回溯中，我意识到encryption是“强大”所要求的，这是“超级”所要求的。我在客户端JavaScript代码中具有相同的superagent导入，但工作正常。我将节点（服务器）和客户端的编译JS代码进行了比较，两者都是相同的。所以它的构build方式似乎不是一个问题。有没有人看过这个错误，你会知道需要做什么？

反应文件命名约定为jsx: 我是新的反应。最初我开始使用create-react-app 。文件名默认是index.js 。然后我将这个文件重命名为index.jsx 。当我尝试使用npm start应用npm start我收到以下错误。 > react-scripts start Could not find a required file. Name: index.js Searched in: D:\WorkSpace\React\chat\src npm ERR! Windows_NT 6.1.7601 npm ERR! argv "D:\\Applns\\nodejs\\node.exe" "D:\\Applns\\nodejs\\node_modules\\ npm\\bin\\npm-cli.js" "start" npm ERR! node v6.10.0 npm ERR! npm v3.10.10 npm ERR! code ELIFECYCLE npm ERR! chat@0.1.0 start: `react-scripts start` npm ERR! […]

React Router v4中的indexLink: 菜鸟在这里。在React Router v4中有没有新的方法来使用indexLink？我正在更新一些版本3代码（我想我离开angular度避免所有这些弃用！）我把它带入一些descructuring： var {NavLink, IndexLink} = require('react-router-dom'); 并使用IndexLink保持它始终不醒目： <h2>Nav</h2> <IndexLink to="/" activeClassName="active" activeStyle={{fontWeight: 'bold'}}>blah blah blah</IndexLink> //Other navlinks working fine IndexLink是打破我的代码的唯一的东西，这是从我改变它的错误。 “警告：React.createElement：type是无效的 – 期望一个string（对于内置组件）或一个类/函数（对于复合组件），但得到：undefined。你可能忘了从你定义的文件中导出你的组件检查Nav的渲染方法“。一切都被导出，简单的应用程序完美工作，直到我添加IndexLink。现在传递出去。