
向数组对象中新增数据不能直接arr = arr.push(),这样数组会强制类型转换,变成arr=arr.length。
错误写法:
正确写法:[...this.state.arr,obj],即:
react组件传值,大概有下面几种方法:
props
context
redux
react-router 路由切换时通过url传值(少量非机密数据,其实也是props传)。
父组件通过props传递给子组件;
父组件通过props向子组件传入一个方法,子组件在通过调用该方法,将数据以参数的形式传给父组件,父组件可以在该方法中对传入的数据进行处理;
1.props.params(推荐)
当页面跳转到UserPage页面之后,取出传过来的值:
上面的方法可以传递一个或多个值,但是每个值的类型都是字符串,没法传递一个对象,如果传递的话可以将json对象转换为字符串,然后传递过去,传递过去之后再将json字符串转换为对象将数据取出来
2.query(不推荐:刷新页面参数丢失)
query方式使用很简单,类似于表单中的get方法,传递参数为明文
3.state(不推荐,刷新页面参数丢失)
state方式类似于post方式,使用方式和query类似
特别提示:
1,获取参数时要用this.props.match.params.name
2,如果在子组件里打印要记得传this.props,如下:
通过redux来传值的实现
1,我们先写一个createAction的函数
2,在reducer里面:
当action触发reducer时,会把action的result传给reducer的params。写好这里,我们就可以在组件中传给adction params了。
先把actionCreator拿出来。
在组件的某个需要的地方,可以直接向它传我们要放进redux里的数据:
这时,我们就可以在另外一个组件中取到刚刚放进去的数据。
另外一个组件:
把redux中的params数据映射到example上。
下面,就可以用了:
自动添加 px。React 推荐使用内联样式。我们可以使用 camelCase 语法来设置内联样式. React 会在指定元素数字后自动添加 px 。
React为此引入了虚拟DOM(Virtual DOM)的机制:在浏览器端用Javascript实现了一套DOM API。基于React进行开发时所有的DOM构造都是通过虚拟DOM进行,每当数据变化时,React都会重新构建整个DOM树,然后React将当前 整个DOM树和上一次的DOM树进行对比,得到DOM结构的区别,然后仅仅将需要变化的部分进行实际的浏览器DOM更新,而且React能够批处理虚拟 DOM的刷新。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)