Question

所以我使用const，如何将其更改为反应组件与相同的地图道具＆amp;功能

我需要将状态改为此。

const SyncValidationForm = (props) => {
  const { handleSubmit, pristine, reset, submitting } = props
  return (
    <form className ="formmailforbook" onSubmit={handleSubmit(submit)}>

      <Field name="email" type="email" component={renderField} label="Email"/>
      <div>
        <button className ="hero_button margin_left" type="submit" disabled={submitting}>Submit</button>
      </div>

    </form>
  )
}

Answer 1

非常简单的翻译，你可以在render方法中进行相同的道具解构。现在只有轻微的变化才能从this.props拉出来：

import React, { Component } from 'react';

export default class SyncValidationForm extends Component {
  render () {
    const { handleSubmit, pristine, reset, submitting } = this.props;
    return (
      <form className ="formmailforbook" onSubmit={handleSubmit(submit)}>

        <Field name="email" type="email" component={renderField} label="Email"/>
        <div>
          <button className ="hero_button margin_left" type="submit" disabled={submitting}>Submit</button>
        </div>

      </form>
    )
  }
}

Answer 2

它非常简单..将代码复制到新文件并在const之前添加export default。

export default const SyncValidationForm

导入文件时导入其他组件，只要你想要组件，并使用导入的名称作为jsx名称作为usal并提供道具。

将const转换为组件

2 个答案: