草庐IT

example-redux-update-nested-props

全部标签

javascript - 可以递归定义 React prop 类型吗?

假设我们正在定义一个将显示树的React类。React.createClass({propTypes:{tree:treeType},render:function(){//...}});这是treeType的定义,它显然不起作用,但希望能说明我要表达的意思。vartreeType=React.PropTypes.shape({value:React.PropTypes.string,children:React.PropTypes.arrayOf(treeType)})有没有办法让类型懒惰地引用自己,这样就可以工作了? 最佳答案

javascript - 我应该如何将 redux 与不会被重用的嵌套子组件一起使用?

我正在开发一个包含许多子组件的组件,其中一些嵌套有5层。我对使用redux感兴趣,因为它具有在公共(public)状态原子中拥有单一事实来源的优势。我不理解的是智能/dumb组件推荐,以及将提供程序置于主要组件之上并通过props传递所有内容。如果我这样做,那么我需要将Prop一直向下传递到第五个嵌套项,以便它可以进行回调以分派(dispatch)操作或查看仅它需要而不是其父项需要的状态。我知道这是为了代码重用,但子组件永远不会在主组件之外使用。这里推荐的解决方案是什么?还在用Prop?注意:这个库的作者要求我们在StackOverflow上提问。我之所以提到这一点,是因为SO似乎将“

javascript - React - 检查 Prop 是否存在

我在互联网上搜索了这个问题的答案,但没有找到。因此,我在这里发布我的问题。我有一个父组件(App)和一个子组件(Child)。App组件有一个状态,其中包含一些数据,如下所示:classAppextendsComponent{constructor(){super()this.state={currentOrganization:{name:'name',email:'email'}}render(){return()}}}在我的子组件中,我有一个表单:classChildextendsComponent{constructor(){super()this.state={formDat

javascript - react 中的 JSX prop 的 propType 是什么

在React中,您可以设置进入组件的Prop的propType。对于我的一个Prop,我希望该值可以为null或一行JSX。React文档没有涵盖JSX应该使用什么propType。在测试时我发现它在使用对象或元素的propTypes时不会抛出错误。当使用另一个符号时,我会得到一个错误,说它是一个对象。如果它肯定是一个对象,当它是一个元素时它应该提示。JSX的正确propType是什么? 最佳答案 尝试使用这个propType...React.PropTypes.element 关于ja

javascript - Connect 不能与 Redux-react 中的 StateLess 组件一起使用

我正在从其他组件调度一个Action,并且商店正在使用svgArr属性进行更新,但是尽管以下无状态组件connect'ed到商店,当svgArr的存储更改时,它不会更新。作为无状态组件,它应该如何表现?还是我做错了什么?constLayer=(props)=>{console.log(props.svgArr);return(hi);};connect((state)=>{return{svgArr:state.svgArr};},Layer);exportdefaultLayer; 最佳答案 您似乎正在导出Layer而不是Laye

javascript - 如何使用 TypeScript 为无状态、功能性 React 组件指定(可选)默认 Prop ?

我正在尝试在Typescript中创建一个带有可选props和defaultProps的无状态React组件(用于ReactNative项目)。这对于vanillaJS来说是微不足道的,但我对如何在TypeScript中实现它感到困惑。使用以下代码:importReact,{Component}from'react';import{Text}from'react-native';interfaceTestProps{title?:string,name?:string}constdefaultProps:TestProps={title:'Mr',name:'McGee'}constT

javascript - 在 .map 函数中使用 react Prop

这个问题在这里已经有了答案:Howtoaccessthecorrect`this`insideacallback(13个答案)关闭6年前。假设我的其中一个组件具有以下渲染功能。我从父元素传递了一个changeTid属性函数。父级:child:(我正在使用ES6类)render(){varRequestNodes=this.props.data.map(function(request){return();});return({RequestNodes});}我不能在我的map函数中使用this.props.changeTid,因为this没有引用我不需要的内容。我在哪里绑定(bind)

javascript - 使用 .prop 在 JQuery 中隐藏按钮(隐藏 : true)

我正在尝试弄清楚如何使用.prop(hidden:true)方法使用JQuery隐藏按钮。出于某种原因,在Chrome中,当我设置此值并查看html时,该按钮有一个隐藏元素,但该按钮在页面上仍然显示为可见。有什么想法吗? 最佳答案 按钮没有隐藏属性?$('button').hide();或$('button').toggle(true);//showsbutton$('button').toggle(false);//hidesbutton 关于javascript-使用.prop在JQ

javascript - 转移 { ..this.props } 但排除某些

是否可以将props向下传输到子组件,其中{..this.props}用于更简洁的语法,但是排除某些props,如className或id? 最佳答案 您可以使用解构来完成这项工作:const{className,id,...newProps}=this.props;//eslint-disable-line//`newProps`variabledoesnotcontain`className`and`id`properties由于此语法目前是ECMAScript提案(Rest/SpreadProperties),您需要转换代码以

javascript - 使用 redux 调用 api 时,componentWillReceiveProps 方法不再运行

我将使用redux调用api:我使用了axios,history,react-redux,react-router-native,react-router,,redux-promise-middleware,redux-thunk组件使用redux进行api调用:我创建了Reducers文件夹,并将我所有的reducer文件放在它们自己的文件中,然后将它们合并到一个主文件中,如下所示这是我的generateoptReducer.js文件:constinitialState={data:{},error:null,status:null};import{generateOTP}from'