Questions tagged «redux»

我要迁移到Redux。 我的应用程序包含很多部分（页面，组件），因此我想创建许多化简器。Redux的例子表明，我应该使用它combineReducers()来生成一个reducer。 另外，据我了解，Redux应用程序应具有一个存储，并且在应用程序启动后即会创建。创建商店时，我应该通过我的组合减速器。如果应用程序不是太大，这是有道理的。 但是，如果我构建多个JavaScript捆绑包怎么办？例如，应用程序的每个页面都有自己的捆绑软件。我认为在这种情况下，一个减速器组合不好。我浏览了Redux的源代码，发现了replaceReducer()功能。这似乎是我想要的。 replaceReducer()当我在应用程序的各个部分之间移动时，我可以为应用程序的每个部分创建组合的reducer并使用。 这是一个好方法吗？

187 javascript  flux  redux  code-splitting 

已关闭。这个问题是基于观点的。它当前不接受答案。 想改善这个问题吗？更新问题，以便通过编辑此帖子以事实和引文回答。 2年前关闭。 改善这个问题 React 16.3.0已发布，并且Context API不再是实验功能。Dan Abramov（Redux的创建者）在这里对此发表了很好的评论，但是Context仍然是实验性功能已经有两年了。 我的问题是，根据您的看法/经验，我何时应该在React Redux上使用React Context，反之亦然？

186 javascript  reactjs  redux  react-redux  react-context 

我想将状态树的某些部分持久保存到localStorage中。这样做合适的地方是什么？减速器或动作？

166 javascript  redux  local-storage  state 

是否有系统的方法来调试导致组件在React中重新渲染的原因？我放置了一个简单的console.log（）来查看它渲染了多少时间，但是在弄清楚是什么导致组件多次渲染（例如，我的情况是4次）时遇到了麻烦。是否存在显示时间轴和/或所有组件树渲染和顺序的工具？

156 reactjs  redux 

这是来自Google Adsense应用程序页面的示例。在主页之前显示的加载屏幕在之后显示。 我不知道如何使用React来做同样的事情，因为如果我使加载屏幕由React组件呈现，它不会在页面加载时显示，因为它必须等待DOM呈现。 更新时间： 我通过将屏幕加载程序放入index.html并在React componentDidMount()生命周期方法中将其删除来举例说明了我的方法。 示例和react-loading-screen。

149 reactjs  asynchronous  redux 

我正在使用Redux。在我的reducer中，我试图从这样的对象中删除一个属性： const state = { a: '1', b: '2', c: { x: '42', y: '43' }, } 我想拥有这样的东西而不必改变原始状态： const newState = { a: '1', b: '2', c: { x: '42', }, } 我试过了： let newState = Object.assign({}, state); delete newState.c.y 但是由于某些原因，它会同时从两个状态中删除该属性。 能帮我做到吗？

145 javascript  immutability  redux 

完整代码在这里：https : //gist.github.com/js08/0ec3d70dfda76d7e9fb4 你好 我有一个应用程序，其中根据构建环境显示了针对台式机和移动设备的不同模板。 我可以在需要隐藏移动模板的导航菜单的地方成功开发它。 现在，我能够编写一个测试用例，其中它通过原型获取所有值并正确呈现 但不确定如何在移动设备上编写单元测试用例时，不应呈现导航组件。 我尝试过，但是遇到错误...您能告诉我如何解决它。 提供下面的代码。 测试用例 import {expect} from 'chai'; import React from 'react'; import TestUtils from 'react-addons-test-utils'; import {SportsTopPortion} from '../../../src/components/sports-top-portion/sports-top-portion.jsx'; require('../../test-utils/dom'); describe('"sports-top-portion" Unit Tests', function() { let shallowRenderer = TestUtils.createRenderer(); let sportsContentContainerLayout ='mobile'; let sportsContentContainerProfile = {'exists': 'hasSidebar'}; let sportsContentContainerAuthExchange = {hasValidAccessToken: true}; …

142 reactjs  mocha  redux 

如何arr[]在reducer的redux状态数组中添加元素？我正在这样做- import {ADD_ITEM} from '../Actions/UserActions' const initialUserState = { arr:[] } export default function userState(state = initialUserState, action) { console.log(arr); switch (action.type) { case ADD_ITEM: return { ...state, arr: state.arr.push([action.newItem]) } default: return state } }

140 react-native  redux  react-redux 

react redux中的component和container有什么区别？

135 javascript  reactjs  redux 

我用过Redux-Saga。到目前为止，用它编写的代码很容易推理，除了JS生成器功能不时使我头晕。据我了解，Redux-Observable可以完成类似的处理副作用的工作，但无需使用生成器功能。 但是，来自Redux-Observable的文档并没有提供很多关于为什么它比Redux-Saga优越的意见。我想知道是否不使用生成器功能是使用Redux-Observable的唯一好处。使用Redux-Observable而不是Redux-Saga可能带来什么弊端，陷阱或妥协？提前致谢。

133 javascript  redux  reactive-programming  redux-saga  redux-observable 

与其在一个类中编写组件，不如使用函数语法。 如何覆盖componentDidMount，componentWillMount内部功能部件？ 可能吗？ const grid = (props) => { console.log(props); let {skuRules} = props; const componentDidMount = () => { if(!props.fetched) { props.fetchRules(); } console.log('mount it!'); }; return( <Content title="Promotions" breadcrumbs={breadcrumbs} fetched={skuRules.fetched}> <Box title="Sku Promotion"> <ActionButtons buttons={actionButtons} /> <SkuRuleGrid data={skuRules.payload} fetch={props.fetchSkuRules} /> </Box> </Content> ) }

133 reactjs  redux 

我得到了一种用于创建，读取，更新和删除的表单。我用相同的形式创建了3个组件，但它们传递了不同的道具。我得到了CreateForm.js，ViewForm.js（带有删除按钮的只读）和UpdateForm.js。 我以前使用过PHP，所以我总是以一种形式进行操作。 我使用React和Redux来管理商店。 当我进入CreateForm组件时，我将这些道具传递给子组件，createForm={true}以使其不使用值填充输入并且不禁用它们。在我的ViewForm组件中，我传递了props readonly="readonly"。 而且我遇到了一个文本区域，该区域充满了一个值并且无法更新。具有值的React textarea是只读的，但需要更新 只有一个组件来处理表单的这些不同状态的最佳结构是什么？ 您有什么建议，教程，视频，演示可以分享吗？

128 javascript  reactjs  crud  redux 

我有一个react / redux应用程序，可从api服务器获取令牌。用户验证之后，我想使所有axios请求都将该令牌作为Authorization标头，而不必手动将其附加到操作中的每个请求。我对React / Redux相当陌生，并且不确定采用最佳方法，也没有在Google上找到任何高质量的点击。 这是我的redux设置： // actions.js import axios from 'axios'; export function loginUser(props) { const url = `https://api.mydomain.com/login/`; const { email, password } = props; const request = axios.post(url, { email, password }); return { type: LOGIN_USER, payload: request }; } export function fetchPages() { /* here is …

127 reactjs  redux  axios 

我是一名javascript / redux / react初学者，使用redux，react-redux和react构建一个小型应用程序。出于某种原因，当在连接（反应-redux绑定）的同时使用mapDispatchToProps函数时，我收到一个TypeError，指示我尝试执行生成的prop时，dispatch不是函数。但是，当我将调度作为道具调用时（请参阅提供的代码中的setAddr函数），它可以工作。 我很好奇这是为什么，在redux docs的示例TODO应用程序中，mapDispatchToProps方法是以相同的方式设置的。当我在函数内部进行console.log（dispatch）时，它说dispatch是类型对象。我可以继续以这种方式使用调度，但是在继续使用redux之前，我会更好地知道为什么会这样。我正在将webpack与babel-loaders一起使用进行编译。 我的代码： import React, { PropTypes, Component } from 'react'; import { connect } from 'react-redux'; import { setAddresses } from '../actions.js'; import GeoCode from './geoCode.js'; import FlatButton from 'material-ui/lib/flat-button'; const Start = React.createClass({ propTypes: { onSubmit: PropTypes.func.isRequired }, setAddr: function(){ this.props.dispatch( setAddresses({ pickup: …

124 javascript  reactjs  redux  react-redux 

如何在saga函数中访问redux状态？ 简短答案： import { select } from 'redux-saga/effects'; ... let data = yield select(stateSelectorFunction);

121 javascript  reactjs  redux  react-redux  redux-saga