栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

React不会在路线参数更改或查询更改时重新加载组件数据

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

React不会在路线参数更改或查询更改时重新加载组件数据

与一起

componentDidMount
,您还需要在页面中实现
componentWillReceiveProps
或使用
getDerivedStateFromProps
(从v16.3.0起),
Products
因为同一组件已
re-rendered
更新,
params
并且
notre-mounted
当您更改路线参数时,这是因为参数是作为prop传递给组件的,而onprops会发生变化,React组件会重新渲染而不是重新安装。

编辑:
从v16.3.0起,用于

getDerivedStateFromProps
根据道具设置/更新状态(无需在两种不同的生命周期方法中指定它)

static getDerivedStateFromProps(nextProps, prevState) {   if (nextProps.match.params.product !== prevState.currentProductId){      const currentProductId = nextProps.match.params.product      const result = productlist.products.filter(obj => {        return obj.id === currentProductId;      })     return {        product: result[0],        currentId: currentProductId,        result      }  }  return null;}

在v16.3.0之前的版本中,您将使用componentWillReceiveProps

componentWillReceiveProps(nextProps) {    if (nextProps.match.params.product !== this.props.match.params.product) {      const currentProductId = nextProps.match.params.product      const result = productlist.products.filter(obj => {        return obj.id === currentProductId;      })      this.setState({        product: result[0],        currentId: currentProductId,        result      })    }  }


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/416037.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号