草庐IT

javascript - Redux 在组件之间共享 Action

我正在使用react-native和redux构建一个移动应用程序,我正在以这种方式按功能组织我的项目结构:组件1/---Component1Actions.js---Component1Reducer.js---...组件2/---Component2Actions.js---Component2Reducer.js---...在我看来,这种项目结构令人惊叹的原因有很多,首先是因为它具有很强的可扩展性。到目前为止我遇到的唯一问题是当2个不同的组件必须分派(dispatch)相同的操作时(例如文本框中的简单文本更改)。在2个不同的文件中重写完全相同的操作是没有意义的,而且我也知道将一个

javascript - Concat vs 插入在 React 最佳实践中添加新数组

许多人提倡不可变性,因为他们将redux与react一起使用,但我仍然看到人们使用push而不是concat。以这段代码为例:submitComment(){console.log('submitComment:'+JSON.stringify(this.state.comment))APIManager.post('/api/comment',this.state.comment,(err,response)=>{if(err){alert(err)return}console.log(JSON.stringify(response))letupdateList=Object.ass

javascript - 如何检查 redux-form 是否存在错误

我正在使用React+Redux和redux-form进行表单处理和验证。到目前为止,它非常易于使用,我可以使用field.touched和field.error轻松检查各个表单字段的验证状态,但我似乎找不到任何方法或属性来告诉我是否有任何整个表格的错误。React的工作方式是,任何表单在加载后都会产生一堆错误,这就是为什么您需要使用field.touched来测试各个字段。我想要做的是在表单中的任何地方有任何错误时显示一些通用标记,但只显示一次。所以真的,我希望有类似form.touched和form.error的东西。我有一个辅助函数的设计,它将检查表单中的所有字段并返回一个boo

javascript - Heroku "Invalid Host header"HOST 配置中的 ReactJS APP?

我正在尝试将我的Reactapp在Heroku上。整个项目包括一个API(express)和一个客户端(ReactJS)。我已将我的API放在heroku上。但是当我把我的客户端放在Heroku上时,它显示构建成功。但是当我open它,它显示InvalidHostheader。我用谷歌搜索了这个问题,很多人告诉我配置HOST.但是他们正在使用webpack。我使用create-react-app构建它,并通过npmstart运行它。我想知道如何以最简单的方式解决这个问题。谢谢。 最佳答案 如果出于任何原因您试图在没有服务器的情况下部

javascript - 当所有数据准备好时加载组件

我正在使用React和Redux。在此示例中,我的类(class)包含ma​​pStateToProps和ma​​pDispatchToPropsclassEnigmaPageextendsComponent{constructor(props){super(props);}componentDidMount(){this.props.authCheckState();}readUserData(){this.props.loadLevel(this.props.userId);}render(){return()}}constmapDispatchToProps=dispatch=>

javascript - 如何使用 Axios 从 JSON 中获取数据?

我正在尝试使用Axios在表中以JSON格式获取服务器端数据,但无法理解如何获取每个字段,如id、companyInfo等。json:[{"id":1,"companyInfo":1,"receiptNum":1,"receiptSeries":"АА","customerName":"Mark","customerSurname":"Smith","customerMiddleName":"Jk","customerPhone":"0845121","services":[2,16]}]axios:store.dispatch((dispatch)=>{dispatch({type:

javascript - 如何限制 react-redux 连接更新重新渲染到特定状态分支?

我有一个更新全局计数器的Action和缩减器。此操作以快速间隔触发。reducer为每个操作返回一个新的状态副本。reducer看起来像:import{handleActions}from'redux-actions';import{sceneTick}from'./actions';exportdefault(state,action)=>handleActions({[sceneTick]:(state,action)=>{return{...state,loop:action.payload,}},我在各种React组件上使用react-redux的connect方法。并非所有组

javascript - 正确更新/合并 React Redux 存储中的数组值,不重复

我的初始状态如下所示,如果添加了新书或更改了价格,那么新的更新数组来自服务,我需要将其结果合并到我的初始状态。constinitialState={booksData:[{"Code":"BK01","price":"5"},{"code":"BK02","price":"30"},{"code":"BK03","price":"332"},{"code":"BK04","price":"123"}]};来自服务器的更新数组有少量记录更新/新data:[{"Code":"BK01","price":"10"},{"code":"BK02","price":"25"},{"code":"

javascript - redux 的 dispatch() 中的 [[Scopes]] 是什么

我正在使用redux和react。这使得dispatch可以作为组件中的Prop使用。因此,当我console.log(this.props)时,我在调度键下的日志中看到以下对象。[[Scopes]]:Scopes[5]0:Closure1:Closure2:Closure(createThunkMiddleware)3:Closure4:Global谁能解释一下这是什么? 最佳答案 [[Scopes]]是Chrome开发者工具在内部添加和使用的私有(private)属性,在C++中,hereinthesource.它显示函数范围内

javascript - 如果连接到未更改的商店,React componentDidUpdate 方法不会在继承的 Prop 更改时触发

我想让我的组件知道是否已经加载了一些库。要知道从任何上下文我都将它连接到我商店的“库”reducer到我的组件。我还从调用组件的父级向它传递一个配置对象this.props.dataObject。像这样:classGoogleButtonextendsComponent{render(){if(this.props.libraries.google){return}else{returnnull}}componentDidUpdate(){gapi.interactivepost.render('sharePost',this.props.dataObject)}}functionma