
如何重置Redux存储的状态?
我正在使用Redux进行状态管理。如何将商店重置为初始状态?例如,假设我有两个用户帐户(u1和u2)。想象以下事件序列:用户u1登录到该应用程序并执行某些操作,因此我们在存储中缓存了一些数据。用户u1注销。用户u2无需刷新浏览器即可登录应用程序。此时,缓存的数据将与关联u1,我...
2024-01-10
如何在Redux中设置初始状态
我试图弄清楚如何为redux中的商店设置初始状态。我以https://github.com/reactjs/redux/blob/master/examples/todos-with-undo/reducers/index.js为例。我试图修改代码,以便待办事项已初始化一个值。const todoApp = combineReducers({ todos, visibilityFilter}, { todos: [{id:123, text:'hello', completed: false}]})按...
2024-01-10
使用Redux作为初始组件状态
我使用Redux作为用于编辑当前选定项目(包含这些属性:“name”和“selected”)的名称的组件中的初始状态。它用作本地初始状态,因为我只想在点击保存按钮(我还没有实现)时更新Redux全局状态。使用Redux作为初始组件状态constructor(props) { super(props) this.state = { item: this.props.item } } ...
2024-01-10
Redux-Saga的无限循环
我正在使用react-router v4和redux-saga。我正在尝试在页面加载时进行API调用。当我访问时/detailpage/slug/,我的应用程序似乎陷入了循环并无休止地调用了我的API端点。这是我的应用程序的设置方法。假设我的进口是正确的。const history = createHistory()const sagaMiddleware = createSagaMiddleware()const middleware = [routerMiddl...
2024-01-10
如何在Redux中触发回调函数?
React和Redux专家。如何在Redux中触发回调函数?我是React和Redux的新手。当Redux状态改变时,我的问题与触发回调(函数)调用有关。我陷入这个实现。在我的理解中,主持人/观点通过道具更新。让我在下面的例子中进一步说明。<ParentComponent> <Child1Component/> <Child2Component/> </ParentComponent>...
2024-01-10
如何在刷新时保持Redux状态树?
Redux文档的第一个原理是:整个应用程序的状态存储在单个存储中的对象树中。我实际上以为我很好地理解了所有原则。但是我现在对应用程序的含义感到困惑。我知道,如果应用程序只是网站中复杂的小部分之一,并且仅用一页即可工作。但是,如果申请意味着整个网站怎么办?我应该使用LocalStor...
2024-01-10
在Redux中,状态实际存储在哪里?
我对这个问题进行了一些搜索,但发现了非常模糊的答案。在redux中,我们知道状态存储为对象。但是这种状态实际上存储在哪里?它是否以某种方式保存为文件,以后我们可以访问?我所知道的是,它不会以Cookie格式或浏览器的本地存储方式存储它。回答:Redux中的状态存储在Redux存储中的内存中。...
2024-01-10
向Redux Reducer添加回调
向传递给动作的回调添加回调时,是否会出现任何错误/反模式式的错误(就“ react-in-react / redux”而言)action.data?// reducerACTION_FOR_REDUCER() { var x = 123 if ( action.data.callback ) action.data.callback( x ) return { something: action.data.somedata }},然后稍后在调用操作时在App中访问该数据(也许在容器中)// l...
2024-01-10
在Redux中,是否需要进行深度复制
下面的对象action.data有一个嵌套对象address{ name: 'Ben', address: { country: 'Australia', state: 'NSW' }}我应该如何在减速器中处理它?const rootReducer = (state = initState, action) { switch(action.type) { switch RECEIVE_DATA: return {...s...
2024-01-10
Redux传奇中的getState?
我有一家商店,上面有物品清单。当我的应用程序第一次加载时,我需要对项目进行反序列化,就像在基于项目创建一些内存中对象一样。这些项目存储在我的redux存储中,并由处理itemsReducer。我正在尝试使用redux-saga处理反序列化,这是副作用。在首页加载时,我调度了一个操作:dispatch( deserializeItems...
2024-01-10
如何通过Redux中的api获取数据?
我是reactjs / redux的初学者,找不到如何使用api调用在redux应用程序中检索数据的简单示例。我猜您可以使用jqueryajax调用,但是那里可能还有更好的选择?回答:JSfiddle;http://jsfiddle.net/cdagli/b2uq8704/6/它使用redux,redux-thunk和fetch。提取方法;function fetchPostsWithRedux() { return (dispatch) => { dispatch(fetchPost...
2024-01-10
是否可以从组件外部触发Redux操作?
我正在构建一个React应用,并正在调用一个自定义处理程序库来调用我们的REST API。在这些(非响应)函数中,我想触发Redux操作以使用端点响应来更新商店,但是如果没有通常的’mapDispatchToProps’/connect()方法,就无法弄清楚如何触发Redux操作。这可能吗?谢谢回答:为了从Reactcomponent您的范围之...
2024-01-10
如何在Redux-Saga中实现回调?
场景是,我要重定向用户或根据成功显示警报,在分派操作后显示错误回调。下面是使用 完成任务的代码this.props.actions.login(credentials).then((success)=>redirectToHomePage).catch((error)=>alertError);因为redux-thunk中的调度动作返回了Promise,所以响应起来很容易。但是现在,我开始沉迷于redux-saga,试图弄清楚如何...
2024-01-10
Redux连接的组件如何知道何时重新渲染?
我可能缺少一些非常明显的东西,想让自己清楚。这是我的理解。在幼稚的react组件中,我们有states&props。更新state时会setState重新渲染整个组件。props大多是只读的,更新它们没有任何意义。在订阅redux商店的react组件中,通过类似于store.subscribe(render),它每次商店更新时都会重新渲染。react-redux有...
2024-01-10
如何在Redux中更新特定数组项内的单个值
我遇到的问题是,状态的重新呈现会导致ui问题,并建议仅更新reducer内的特定值以减少页面上的重新呈现量。这是我的状态的例子{ name: "some name", subtitle: "some subtitle", contents: [ {title: "some title", text: "some text"}, {title: "some other title", text: "some other text"} ]}我目前正在这样更新case 'SOME_ACTION': r...
2024-01-10
如何在Redux中显示执行异步操作的模式对话框?
我正在构建一个需要在某些情况下显示确认对话框的应用程序。假设我要删除某些东西,然后我将分派一个动作,deleteSomething(id)以便某些化简器会捕获该事件并填充对话框化简器以显示它。当此对话框提交时,我会怀疑。该组件如何根据分派的第一个动作分派适当的动作?动作创建者应该处理这种...
2024-01-10
如何使用Redux Saga测试API请求失败?
我正在尝试测试我的传奇可能遵循的每种情况,但是我无法使我想要的行为发生。这很简单,我有一个HTTP请求(登录),并且我想通过模拟我的API方法来测试成功和失败的情况。但是,看起来好像calleffect并没有触发我的api函数,我还没有真正了解它的工作原理,但是我猜中间件负责调用该函数,并且...
2024-01-10
在Redux Reducer中更新状态的正确方法
我是redux和es6语法的新手。我使用官方的redux教程和此示例制作了我的应用。以下是JS代码段。我的观点-在post reducer中定义REQUEST_POST_BODY和RECEIVE_POST_BODY案例。主要困难-在商店中查找和更新合适的对象。我尝试使用示例中的代码: return Object.assign({}, state, { [action.subreddit]: posts(state[action.subreddit], actio...
2024-01-10
Redux-如何在reducer中向数组添加条目
我坚持了这一点,但我无法继续前进-我猜解决方案很简单,但我不知道。我正在尝试在reducer中添加条目,以便输入的数据看起来像这样:state = { entryId: { entryName: ["something", "something2", "something3" /* and so on... */] }};到目前为止,这是我得到的最接近的内容,但是,它没有添加新的唯一条目,而是...
2024-01-10
redux replaceReducer似乎不适用于HMR
即时配置开发环境react-hot-loader,HMR是正常工作。我添加下面的配置redux redux replaceReducer似乎不适用于HMRif (module.hot) { // Enable Webpack hot module replacement for reducers module.hot.accept('../reducers',() => { console.log('reducers change') const nextReducer =...
2024-01-10
React Redux - 从reducer传递数据时容器/组件未更新
我是React的新手,请记住这一点。React Redux - 从reducer传递数据时容器/组件未更新我想渲染从food2fork API获取的食谱列表,但即使数据获取正确,我也无法获取更新视图。这里的recipe_list.js:import React, { Component } from "react"; import { connect } from "react-redux"; class RecipesList extends Component { // renderRe...
2024-01-10
React-Router:IndexRoute的目的是什么?
我不明白使用 和 的目的是什么。似乎在任何情况下,除非激活了About路径,否则下面的代码都会首先选择Home组件。<Route path="/" component={App}> <IndexRoute component={Home}/> <Route path="about" component={About}/></Route>与<Route path="/" component={App}> <Route path="home" component={Home}/> <Route pat...
2024-01-10
为什么Angular-ui-router的<templateUrl>在我的所有文件托管在S3存储桶中都不起作用?
我正在构建一个使用Angular-UI-Router的示例AngularJS单页面应用程序。但是,我没有使用Angular应用程序通过Web服务器提供的常用设置,而是运行一个服务器端应用程序,它只是响应HTTP请求提供index.html页面。所需的所有其他资源只是指向我的AWS S3存储桶或其他位置的指针。为什么Angular-ui-router的<templateUrl>在...
2024-01-10
React-Redux:应该将所有组件状态保存在Redux Store中
说我有一个简单的切换:当我单击按钮时,颜色组件在红色和蓝色之间切换我可以通过执行以下操作来达到此结果。index.jsButton: onClick={()=>{dispatch(changeColor())}}Color: this.props.color ? blue : redcontainer.jsconnect(mapStateToProps)(indexPage)action_creator.jsfunction changeColor(){ return {type: 'CHANGE_COLO...
2024-01-10
将callBacks传递给redux异步操作是否被认为是一种好习惯?
我想为成功/错误响应显示不同的通知栏,我将两个callBack传递给我的react组件中的redux异步操作,如下所示:<Button onClick={e => this.props.actions.asyncAction(item, this.showSuccessBar, this.showErrorBar)}/>其中asyncAction看起来像这样:export function asyncAction(item, successCallback, errorCallback) { retur...
2024-01-10
如何使用react-testing-library测试react-select
App.jsimport React, { Component } from "react";import Select from "react-select";const SELECT_OPTIONS = ["FOO", "BAR"].map(e => { return { value: e, label: e };});class App extends Component { state = { selected: SELECT_OPTIONS[0].value }; handleSel...
2024-01-10
将Ratchet WsServer与React SecureServer结合使用(WSS/SSL)
我们正试图通过安全连接(WSS)实现websocket,并在我们的项目中实现了cboden/ratchet。所有Works正常连接罚款。环顾文档和Github项目页面,似乎新的React SecureServer类尚未在Ratchet中实现。将Ratchet WsServer与React SecureServer结合使用(WSS/SSL)在我们发现的问题a post about it,它将不被支持,直到后来的版本,但是...
2024-01-10
