- 44
- 0
我有2个组件,Test和Age,他们都通过connect获取数据。
其中Age是Test的子组件。
如果我在 Test父组件的shouldComponentUpdate return false ,
发现Test确实不更新,但是其子组件Age还是会更新(来自connect部分的数据)。
问题是,我如何阻止Age不更新??
import {change} from 'actions'
class Age extends PureComponent{
constructor(props){
super(props);
this.add=this.add.bind(this);
}
add(){
this.props.change({
name:'haha',
age:this.props.age+1
});
}
render(){
return(
<div>
{this.props.names}:{this.props.age}
<input type="button"onClick={this.add} value="+"/>
</div>
)
}
}
const AgeConnect=connect((state)=>{
return state.iReducer;
},(dispatch)=>{
return {
change:(o)=>dispatch(change(o))
}
})(Age);
class Test extends Component{
constructor(props){
super(props)
}
shouldComponentUpdate(){
return false;
}
render(){
return(
<div>
{this.props.name}
<AgeConnect names={this.props.name} />
</div>
)
}
}
const TestConnect=connect((state)=>{
return state.iReducer;
},(dispatch)=>{
return {
change:(o)=>dispatch(change(o))
}
})(Test);
export default TestConnect; - 共 0 条
- 全部回答
-
颠沛流离 普通会员 1楼
在React中,要阻止子组件更新,可以使用React的
useEffectHook和useStateHook。useEffectHook主要用于管理副作用(即副作用是在组件的状态改变时执行的代码),而useStateHook主要用于管理组件的状态(在状态改变时执行的代码)。以下是一个简单的例子,说明如何使用
useEffectHook来阻止子组件更新:```jsx import React, { useState } from 'react';
function MyComponent() { const [count, setCount] = useState(0);
useEffect(() => { console.log('MyComponent mounted');
const handleClick = () => { setCount(count + 1); }; return () => { console.log('MyComponent unmounted'); };}, []);
return (
); }{count}
export default MyComponent; ```
在这个例子中,
useEffectHook首先打印出"MyComponent mounted",这是在组件加载时执行的代码。然后,它定义了一个副作用函数,当点击按钮时,将count状态加1,并返回一个清理副作用函数,当组件卸载时执行。useStateHook用于管理组件的状态,我们在这里使用useStateHook来初始化一个名为count的状态变量,并在组件的状态改变时执行相应的操作。在组件中,我们定义了一个
handleClick函数,当点击按钮时,调用handleClick函数,并将count状态设置为count + 1。然后,我们返回一个清理副作用函数,当组件卸载时执行。在
MyComponent组件的render方法中,我们使用useStateHook来初始化状态,并在状态改变时调用handleClick函数。然后,我们使用<button>元素来显示按钮,当点击按钮时,调用handleClick函数,并在状态改变时更新状态。这样,当组件加载时,
MyComponent组件的count状态被初始化为0。每次handleClick函数被调用时,count状态会递增1,但不会更新count状态的值。当组件卸载时,handleClick函数不再被调用,count状态的值也不会被更新,因此count状态不会在子组件中更新。
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
