草庐IT

reactjs-flux

全部标签

javascript - 使用 'url' 属性时 ReactJS 不从服务器获取数据

我是ReactJS的初学者,刚从theexamplecodeonReact'sofficialsite开始.当我尝试'Fetchingfromtheserver'部分中的代码时,我无法让它工作。两种相对路径我都试过了React.render(,document.getElementById('content'));和绝对路径React.render(,document.getElementById('content'));但是它们都没有正确运行。当我查看Chrome开发工具中的网络面板时,我看到该页面甚至没有发送对data.json的请求。因此我得到了一个错误:Cannotreadpr

javascript - react + 助焊剂 : Getting initial state into a store

我们最近从Angular切换到React+Flux来构建一个相当复杂的业务应用程序。采用让一个容器组件将所有状态作为属性传递到组件树下的方法并不是为我们开发应用程序的实用方法,因为该应用程序使用类似页面的大型模式。确实有足够的状态传递给模式,以便他们将数据加载到他们的存储中。我遇到的问题是我需要将一些初始状态(作为Prop传递)放入模态组件的商店中。在thispostFacebook的好人说,当同步不是目标时,可以使用props作为初始状态。这就是我目前将初始状态放入我的商店的方式:varABC=React.createClass({...getInitialState:functio

javascript - 模拟点击文档 ReactJS/JSDom

所以我正在为在文档上添加点击事件的代码编写一些测试。我正在使用JSDom、ReactJS和Mocha/Chai设置。我在测试中尝试了以下代码:document.addEventListener('click',function(){console.log('test');});React.addons.TestUtils.Simulate.click(document);//alsotriedReact.addons.TestUtils.Simulate.click(document.body);但是这段代码并没有产生我期望的回声。有没有办法用JSDom和ReactJS在文档上模拟点击

javascript - 使用 ReactJS 突出显示文本

我试图突出显示与查询匹配的文本,但我不知道如何让标签显示为HTML而不是文本。varComponent=React.createClass({_highlightQuery:function(name,query){varregex=newRegExp("("+query+")","gi");returnname.replace(regex,"$1");},render:function(){varname="Javascript";varquery="java"return({this._highlightQuery(name,query)});}});当前输出:Java脚本期望的输

javascript - 当URL不匹配任何路由时以及当URL包含/#/使用ReactJS时如何显示404

这是我第一次使用ReactJS,但不是我的项目,我试图将任何不存在的路由重定向到我创建的404页面。当输入任何与路由不匹配的URL时,我的404页面当前按预期显示,除了URL包含/#/时。例如,这个URL将重定向到我的404页面:http://localhost:8080/non-existent-url但是这个URL只会加载我的应用程序的默认路由(主页):http://localhost:8080/#/non-existent-url我不知道/#/是干什么用的,看来应用程序会显示包含或不包含它的有效路由的页面。精简路由文件:importReactfrom"react";import{

javascript - ReactJS:如何更模块化地使用对象的 Prop 类型和形状?

我喜欢明确指定每个类的所有Prop类型。React.createClass({propTypes:{optionalArray:React.PropTypes.array,optionalBool:React.PropTypes.bool,...这是来自阅读可重用组件:https://facebook.github.io/react/docs/reusable-components.html但是,如果我有一个在许多类中使用的非常常见的对象怎么办?例如:varMemoryForm=React.createClass({propTypes:{memory:React.PropTypes.s

javascript - 使用 reactJs TestUtils 模拟文本输入

我希望能够使用reactjs模拟用户在文本框中键入内容,以便测试我的验证状态消息。我有一个在keyUp上验证的react组件下面是我尝试过的一个简单示例。nameInput.props.value='a';React.addons.TestUtils.Simulate.keyUp(nameInput);React.addons.TestUtils.findRenderedDOMComponentWithClass(component,'has-error');当我在验证器中调试时,这似乎并没有改变绑定(bind)文本框的值React.addons.TestUtils.Simulate.

javascript - 如何在浏览器控制台或外部脚本中调用 Reactjs 组件的方法?

我正在创建一个传单map组件,这里是一个关于plunker的例子http://plnkr.co/edit/LkghwOcby49XESdGb782?p=preview这是代码传单.jsx/**@jsxReact.DOM*//*jshintindent:2,node:true,nomen:true,browser:true*//*globalReact*/'usestrict';module.exports=React.createClass({getInitialState:function(){return{map:{}};},componentDidMount:function()

javascript - 在 reactjs 组件中将日期格式化为 long

我有这样一个组件varPost=React.createClass({render:function(){return({this.props.message.content}{"@"+this.props.message.user.login+"•"}{this.props.message.createdAt})}});原来createdAt是一个像1451589259845这样的字符串,我想格式化日期。我怎样才能在ReactJS上做到这一点?我尝试将newDate()放在括号内,但出现错误。 最佳答案 在开始返回之前,只需按照通

javascript - 使用 React Native Router Flux 的合成场景栈(历史)

有没有办法用ReactNativeRouterFlux综合定义场景堆栈(历史)?假设我有一个应用程序,用户可以在其中自然地从A–>B–>C进行导航。我想在场景C上启动应用程序,它具有与自然行为相同的历史记录(A->B->C),因此用户从最初打开场景C。编辑:我想这应该可以通过使用ReduxPersist以某种方式实现,但我发现这与issue相关. 最佳答案 我设法用一个假的空初始场景来做到这一点。这是一个非常hacky的解决方案,从C到B的动画仍然无法正常工作。importReact,{Component}from"react";i