redux相关内容

我什么时候选择 React state 和 Redux Store

我一直在学习 Redux,但我不清楚的部分是,我如何在使用 react state 与 redux store 之间做出决定,然后再调度 action.从我目前的阅读来看,我似乎可以使用 React 状态代替 Redux 存储,并且仍然可以完成工作.我理解使用 Redux 存储和只有 1 个容器组件而其余部分作为无状态组件的关注点分离,但我如何确定何时使用 React 状态与 redux 存储对我 ..
发布时间:2021-12-02 10:46:54 其他开发

在 Redux 中更新嵌套状态的更简洁/更短的方法?

有时减速器会变得有点乱: const initialState = {通知栏:{打开:假,},};导出默认函数(状态 = 初始状态,动作){开关(动作.类型){案例actions.LAYOUT_NOTIFICATIONBAR_OPEN:返回 Object.assign({}, state, {//TODO:找到一种更简洁的方法来做到这一点!通知栏:Object.assign({}, state. ..
发布时间:2021-12-02 10:46:23 前端开发

更新 redux 存储中的嵌套数据

使用 redux 更新存储中嵌套数据数组的最佳/正确方法是什么? 我的商店看起来像这样: {项目:{1:{编号:1,核心价值",链接: [{编号:10001数据:“还有一些东西"},...]},...}} 我有一对异步操作可以更新完整的 items 对象,但我有另一对操作要更新特定的 links 数组. 我的减速器目前看起来像这样,但我不确定这是否是正确的方法: 开关 (act ..
发布时间:2021-12-02 10:44:45 前端开发

React - 在 DOM 渲染时显示加载屏幕?

这是来自 Google Adsense 应用程序页面的示例.主页面之前显示的加载屏幕显示之后. 我不知道如何用 React 做同样的事情,因为如果我让 React 组件渲染加载屏幕,它在页面加载时不会显示,因为它必须等待 DOM 之前渲染. 更新: 我通过将屏幕加载器放在 index.html 中并在 React componentDidMount() 生命周期方法中将其删除来制 ..
发布时间:2021-12-02 10:41:42 其他开发

Redux 中的 store.dispatch 是同步的还是异步的

我意识到这是一个基本问题,但我没能在别处找到答案. store.dispatch 在 Redux 中是同步的还是异步的? 如果它是异步的,是否有可能在动作传播后添加回调,因为 React 可以实现? 解决方案 AFAIK,调度动作是同步的.如果您愿意处理异步调用,您可以在 redux 中使用 thunk-middleware,其中 dispatch 作为回调函数提供,您可以根据 ..
发布时间:2021-12-02 10:40:18 前端开发

如何对 React-Redux 连接组件进行单元测试?

我正在使用 Mocha、Chai、Karma、Sinon、Webpack 进行单元测试. 我按照此链接为 React-Redux 代码配置了我的测试环境. 如何使用 Karma、Babel 和 Webpack 在 React 上实现测试 + 代码覆盖 我可以成功地测试我的 action 和 reducers javascript 代码,但是在测试我的组件时它总是会抛出一些错误. ..
发布时间:2021-12-02 10:32:06 其他开发

这是使用 redux 删除项目的正确方法吗?

我知道我不应该改变输入,而应该克隆对象来改变它.我遵循 redux starter 项目中使用的约定: ADD_ITEM: (state, action) =>({...状态,项目:[...state.items,action.payload.value],lastUpdated: action.payload.date}) 用于添加项目 - 我使用 spread 将项目附加到数组中. ..
发布时间:2021-12-02 10:29:36 前端开发

理解 React-Redux 和 mapStateToProps()

我试图理解 react-redux 的 connect 方法,以及它作为参数的函数.特别是 mapStateToProps(). 按照我的理解,mapStateToProps 的返回值将是从状态派生的对象(因为它存在于商店中),其键将传递给您的目标组件(组件连接应用于)作为道具. 这意味着您的目标组件使用的状态可能与存储在您的商店中的状态具有截然不同的结构. 问:这样可以吗? ..
发布时间:2021-12-02 10:15:30 前端开发

使用 Django 的 CSRF,使用 Axios 的 React+Redux

这是一个教育项目,不用于生产.我不打算将用户登录作为其中的一部分. 我可以在没有用户登录的情况下使用 CSRF 令牌对 Django 进行 POST 调用吗?我可以在不使用 jQuery 的情况下做到这一点吗?我在这里的深度不够,肯定会混淆一些概念. 对于 JavaScript 方面,我发现了这个 redux-csrf 包.我不确定如何使用 Axios 将它与我的 POST 操作结合起 ..
发布时间:2021-12-02 10:13:38 其他开发

如何在redux中更新特定数组项内的单个值

我有一个问题,重新渲染状态会导致 ui 问题,并且建议仅更新我的减速器中的特定值以减少页面上的重新渲染量. 这是我的状态的例子 {name: "一些名字",副标题:“一些副标题",内容: [{title: "some title", text: "some text"},{标题:“其他标题",文字:“其他文字"}]} 我目前正在更新它 case 'SOME_ACTION':返回 { . ..
发布时间:2021-12-02 10:12:56 前端开发

如何在刷新时保留 redux 状态树?

Redux 文档的第一原则是: 整个应用程序的状态存储在单个存储中的对象树中. 而且我实际上认为我很好地理解了所有原则.但我现在很困惑,申请是什么意思. 如果应用程序只是网站中的一个小复杂部分,并且只在一页上工作,我理解.但是如果应用程序意味着整个网站呢?我应该使用 LocalStorage 还是 cookie 或其他东西来保存状态树?但是如果浏览器不支持 LocalStorag ..
发布时间:2021-12-02 10:12:49 其他开发

为什么在 Facebook Flux 上使用 Redux?

我已经阅读了这个答案, reducingboilerplate,看了几个 GitHub 示例,甚至尝试了 redux a一点点(待办事项应用程序). 据我所知,官方 redux 文档动机提供了与传统 MVC 相比的优点架构.但它没有提供问题的答案: 为什么你应该使用 Redux 而不是 Facebook Flux? 这只是编程风格的问题:函数式还是非函数式?或者问题在于 redu ..
发布时间:2021-12-02 10:12:00 前端开发

如何克服 ReactJS 中的 CORS 问题

我正在尝试在我的 React 应用程序中通过 Axios 进行 API 调用.但是,我在浏览器上遇到了这个 CORS 问题.我想知道我是否可以从客户端解决这个问题,因为我在内部没有任何访问 API 的权限.附上我的代码. const response = axios({方法:“发布",数据类型:“jsonp",网址:“https://awww.api.com",数据: {appToken: "" ..
发布时间:2021-12-02 10:07:57 前端开发

React Context 与 React Redux,我应该什么时候使用它们?

React 16.3.0 发布并且 Context API 不再是实验性功能.Dan Abramov(Redux 的创建者)在这里 关于这个,但是 Context 仍然是一个实验性功能已经 2 年了. 我的问题是,在您看来/经验中,我什么时候应该使用 React Context 而不是 React Redux,反之亦然? 解决方案 由于 Context 不再是一个实验性功能,您可以直 ..
发布时间:2021-12-02 10:02:01 前端开发

为什么我的 onClick 在渲染时被调用?- 反应.js

我创建了一个组件: class 创建扩展组件 {构造函数(道具){超级(道具);}使成为() {var playlistDOM = this.renderPlaylists(this.props.playlists);返回 ( {播放列表域})}activatePlaylist(playlistId) {调试器;}渲染播放列表(播放列表){返回 playlists.map(playlis ..
发布时间:2021-12-02 09:58:52 前端开发

在 React 组件之外访问 redux 存储的最佳方式是什么?

@connect 在我尝试访问 React 组件中的商店时效果很好.但是我应该如何在其他一些代码中访问它.例如:假设我想使用授权令牌来创建可在我的应用程序中全局使用的 axios 实例,实现这一目标的最佳方法是什么? 这是我的api.js //工具模块从 'axios' 导入 axios//配置const api = axios.create()api.defaults.baseURL = ..
发布时间:2021-12-02 09:56:15 其他开发

在 ReactJs 中基于动态路径加载图像

我正在尝试在我制作的购物车中显示图片,但它没有显示.我必须导入每个图像吗?我知道我的路径没有问题,因为它以前有效.我认为我的 product.js 文件中可能有问题,但我无法弄清楚. 这是我的 Product.js import React, { Component, PropTypes } from 'react';类产品扩展组件{handleClick = () =>{const { ..
发布时间:2021-12-02 09:55:04 其他开发

React setState 不立即更新

我正在开发一个待办事项应用程序.这是违规代码的一个非常简化的版本.我有一个复选框: 写作项目 这是调用复选框的函数: checkPencil(){this.setState({铅笔:!this. ..
发布时间:2021-12-02 09:49:29 其他开发

何时使用基于 ES6 类的 React 组件与功能性 ES6 React 组件?

在花了一些时间学习 React 之后,我理解了创建组件的两种主要范式之间的区别. 我的问题是我应该什么时候使用哪一个,为什么?一个相对于另一个的好处/权衡是什么? ES6 类: import React, { Component } from 'react';导出类 MyComponent 扩展组件 {使成为() {返回 ( );}} 功能性: const M ..
发布时间:2021-12-02 09:48:22 前端开发

使用 react-router 以编程方式导航

我正在开发一个应用程序,我在其中检查用户是否loggedIn.我必须显示登录表单,否则 dispatch 会更改路由并加载其他组件的 action.这是我的代码: render() {如果(已登录){//调度一个动作来改变路由}//返回登录组件} 如何实现这一点,因为我无法更改 render 函数内的状态. 解决方案 考虑到您正在使用 react-router v4 将 ..
发布时间:2021-12-02 09:41:36 前端开发