Tag: reactjs

通过链接反应路由器中的道具: 我正在使用react-router。我试图通过属性的反应路由器的“链接” var React = require('react'); var Router = require('react-router'); var CreateIdeaView = require('./components/createIdeaView.jsx'); var Link = Router.Link; var Route = Router.Route; var DefaultRoute = Router.DefaultRoute; var RouteHandler = Router.RouteHandler; var App = React.createClass({ render : function(){ return( <div> <Link to="ideas" params={{ testvalue: "hello" }}>Create Idea</Link> <RouteHandler/> </div> ); } }); var routes = ( […]

React – 如何在道具中传递HTML标签？: 我希望能够传递HTML标签的文本，如下所示： <MyComponent text="This is <strong>not</strong> working." /> 但是在MyComponent的渲染方法里面，当我打印出this.props.text ，它实际上打印出了一切： This is <strong>not</strong> working. 有什么办法让ReactparsingHTML并将其正确地转储出去吗？

将对象存储在React组件的状态中？: 是否有可能存储一个对象在React组件的状态？如果是，那么我们如何使用setState来更改该对象中某个键的值？我认为它在语法上不允许写this.setState({ abc.xyz: 'new value' }); 在类似的路线上，我还有一个问题：在React组件中有一组variables是否可以在组件的任何方法中使用，而不是将它们存储在一个状态中？您可以创build一个简单的对象来保存所有这些variables，并将其置于组件级别，就像您将如何在组件上声明任何方法一样。它很可能会遇到在代码中包含大量业务逻辑的情况，并且需要使用许多variables（其值通过多种方法更改），然后根据这些值更改组件的状态。因此，不要将所有这些variables保持在状态中，而只需保留那些值直接反映在UI中的variables。如果这种方法比我在这里写的第一个问题好，那么我不需要在状态中存储一个对象。

在Cloud9.io的Webpack开发服务器上运行我的React应用程序时，收到“无效的主机头”消息: 我正在使用作为一个环境，一个Cloud9.io Ubuntu的VM在线IDE，我已经减less了解决这个错误，只是与Webpack开发服务器运行应用程序。我启动它： webpack-dev-server -d –watch –history-api-fallback –host $IP –port $PORT $ IP是一个variables，其主机地址$ PORT有端口号。我被指示在Cloud 9中部署应用程序时使用这些variables，因为它们具有默认的IP和端口信息。服务器启动并编译代码，没问题，虽然没有显示我的索引文件。只有一个带有“无效主机标题”的空白屏幕作为文本。这是请求： GET / HTTP/1.1 Host: store-client-nestroia1.c9users.io Connection: keep-alive Pragma: no-cache Cache-Control: no-cache Upgrade-Insecure-Requests: 1 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8 DNT: 1 Accept-Encoding: gzip, deflate, sdch, br Accept-Language: […]

Webpack-dev-server提供一个目录列表，而不是应用程序页面: 我只能在/public下看到实际的应用程序。 webpack.config.js中的configuration如下： var path = require('path'); var webpack = require('webpack'); module.exports = { entry: [ 'webpack-dev-server/client?http://localhost:8080', 'webpack/hot/only-dev-server', './app/js/App.js' ], output: { path: path.join(__dirname, 'public'), filename: 'bundle.js', publicPath: 'http://localhost:8080' }, module: { loaders: [ { test: /\.js$/, loaders: ['react-hot', 'babel-loader'], exclude: /node_modules/ } ] }, plugins: [ new webpack.HotModuleReplacementPlugin(), new webpack.NoErrorsPlugin() ] }; 项目层次是：应用 JS […]

React-Router – 未捕获TypeError：无法读取未定义的属性'getCurrentLocation': 我正在使用最新版本的react-router （版本^ 3.0.0）。我使用ES5编写了以下路由： routes.js ： var React = require("react"); var Router = require("react-router"); var AuthorPage = require('./components/authors/authorPage') var App = require('./components/app') var Route = Router.Route; var routes = ( <Route path="/" component={App}> <Route path="authors" component={AuthorPage}/> </Route> ); module.exports = routes; 在另一个名为main.js JS文件中，我执行以下调用： main.js ： var React= require("react"); var ReactDom = require("react-dom"); var Router = […]

React.js：如何从JavaScript中分离出jsx: 有没有办法将jsx从一个组件的渲染function移动到一个单独的文件？如果是这样，我怎么在渲染函数中引用jsx？

如何configurationESLint在primefaces编辑器的反应: 在Atom编辑器中，我安装了以下插件棉短绒棉短绒，eslint 看来他们不认识JSX语法。我已经在命令行工作，但必须使用其他插件，如esprima-fb和eslint-plugin-react 。看起来像Atom编辑器没有这样的插件，并想知道你是否有人知道一个方法来解决这个问题。

在redux存储中更新嵌套的数据: 使用redux更新商店中嵌套数据的最佳/正确方法是什么？我的店看起来像这样： { items:{ 1: { id: 1, key: "value", links: [ { id: 10001 data: "some more stuff" }, … ] }, … } } 我有一对asynchronous操作更新完整的items对象，但我有另一对行动，我想更新特定的links数组。我的减速机目前看起来像这样，但我不知道这是否是正确的方法： switch (action.type) { case RESOURCE_TYPE_LINK_ADD_SUCCESS: // TODO: check whether the following is acceptable or should we create a new one? state.items[action.resourceTypeId].isSourceOf.push(action.resourceTypeLink); return Object.assign({}, state, { items: state.items, […]

反应date对象的propvalidation: 什么是当前首选的方式来validationDate反应中的道具？现在我正在使用： React.PropTypes.object 但是，现在，这种禁止types的棉绒规则已经失败了。我应该使用一个shape还是有一些更好的方法？