Javascript Can'；在使用Formik构建向导时，不要在子组件中使用道具

我正在尝试构建一个表单向导。我通过

react-router

设置向导，并对表单使用

formik

。现在，我在创建可自定义单选按钮时遇到了一个问题。为此，我使用了

react定制收音机
库

当我在路线外使用单选按钮时，它正常工作（代码在文章底部）

当我与路由器一起使用时，道具会传递给子组件：

<Route path="/form/location" render={(props) => (<Pricing {...props} />)} />

提供给
render
函数的
道具是。在这种情况下，您要做的是从父组件传递
道具，而不是路由道具：

class ParentComponent extends React.Component {
  render() {
    const { props } = this;
    const {
      values,
      touched,
      errors,
      setFieldValue,
      setFieldTouched,
    } = props;
    return (
      <Form>
        <Switch>
          <Redirect from="/" exact to="/form/location" />
          <Route
            path="/form/location"
            render={() => <Pricing {...props} />}
          />
        </Switch>
        <MyRadio
          value={values.car}
          onChange={setFieldValue}
          onBlur={setFieldTouched}
          error={errors.car}
          touched={touched.car}
        />
      </Form>
    );
  }
}

类ParentComponent扩展了React.Component{
render（）{
const{props}=this；
常数{
价值观
感动的，
错误，
setFieldValue，
塞特菲尔德被感动了，
}=道具；
返回(
}
/>
);
}
}
如果您需要Formik的道具和此组件，您可以：
render={（formikProps）=>}
这将从两个道具中创建一个长长的属性列表以供定价使用。
如果您使用父级的
道具
，而忽略使用
渲染
功能中的
道具
，会发生什么<代码>（）=>（）
很酷，它看起来很管用，但我真的不明白它的作用。这是类似的说法吗？
  <Form>
    <Switch>
      <Redirect from="/" exact to="/form/location" />
       <Route path="/form/location" render={(props) => (<Pricing {...props} />)} />
    </Switch>
  <MyRadio
      value={values.car}
      onChange={setFieldValue}
      onBlur={setFieldTouched}
      error={errors.car}
      touched={touched.car}
    />
  </Form>

class ParentComponent extends React.Component {
  render() {
    const { props } = this;
    const {
      values,
      touched,
      errors,
      setFieldValue,
      setFieldTouched,
    } = props;
    return (
      <Form>
        <Switch>
          <Redirect from="/" exact to="/form/location" />
          <Route
            path="/form/location"
            render={() => <Pricing {...props} />}
          />
        </Switch>
        <MyRadio
          value={values.car}
          onChange={setFieldValue}
          onBlur={setFieldTouched}
          error={errors.car}
          touched={touched.car}
        />
      </Form>
    );
  }
}