首页 > 解决方案 > 反应 InputRange 组件的问题

问题描述

我有一个名为 Offers 的组件,它列出了给定类别的所有商品。在这个组件中,有一个名为 Sidebar 的子组件,其中有用于按类别、品牌、ecc 过滤报价的输入。我还添加了一个 InputRange 以按最低和最高价格过滤报价,但我在 console.log 中收到了这些错误:

警告:失败的道具类型:“值”必须是 InputRange 中的数字或范围对象(由 Sidebar 创建)在 Sidebar(由 CategorizedOffers 创建)中的 div(由 CategorizedOffers 创建)中的 Offer(由 AppRoot 创建)中的 Route(由AppRoot) 在 Switch (由 AppRoot 创建) 在 Router (由 BrowserRouter 创建) 在 BrowserRouter (由 AppRoot 创建) 在 AppRoot

警告:失败的道具类型:道具value在 中标记为必填Slider,但其值为undefined。在 Slider(由 InputRange 创建) 在 InputRange(由 Sidebar 创建) in 在 side(由 Sidebar 创建) 在 div(由 Sidebar 创建) 在 Sidebar(由 CategorizedOffers 创建) in div(由 CategorizedOffers 创建) 在 Offers(由 AppRoot 创建) 在Route(由 AppRoot 创建) 在 Switch(由 AppRoot 创建) 在 Router(由 BrowserRouter 创建) 在 BrowserRouter(由 AppRoot 创建) 在 AppRoot

警告:失败的道具类型:道具children在 中标记为必填Label,但其值为undefined。in Label(由 Slider 创建) in Slider(由 InputRange 创建) in div(由 Track 创建) in Track(由 InputRange 创建) in div(由 InputRange 创建) in InputRange(由 Sidebar 创建) in aside(由 Sidebar 创建) in div(由 Sidebar 创建) 在 Sidebar(由 CategorizedOffers 创建) 在 div(由 CategorizedOffers 创建) 在 Offers(由 AppRoot 创建) 在 Route(由 AppRoot 创建) 在 Switch(由 AppRoot 创建) 在 Router(由 BrowserRouter 创建) 在 BrowserRouter (由 AppRoot 创建)在 AppRoot 中

这就是我调用 InputRange 组件的方式:

<InputRange 
  minValue={values.min} 
  maxValue={values.max}
  value={values ? values : {min: 0, max: 10}}
  onChange={values => this.setState({values: values})}
/>

其中来自使用 getDerivedStateFromProps 的父组件 Offer 的状态。基本上,问题似乎是当 Sidebar 组件呈现时,它的状态还没有准备好,我不知道如何解决这个问题。

标签: react-native

解决方案


推荐阅读