封装一个input子组件，父组件调用

好的，我可以为您提供一个简单的input子组件的封装示例。您可以将以下代码保存为一个名为Input.js的文件，然后在父组件中导入并使用它。

import React from 'react';

const Input = ({ label, value, onChange }) => {
  return (
    <div>
      <label>{label}</label>
      <input type="text" value={value} onChange={onChange} />
    </div>
  );
}

export default Input;

在父组件中，您可以像这样使用它：

import React, { useState } from 'react';
import Input from './Input';

const ParentComponent = () => {
  const [inputValue, setInputValue] = useState('');

  const handleInputChange = (e) => {
    setInputValue(e.target.value);
  }

  return (
    <div>
      <Input label="Name" value={inputValue} onChange={handleInputChange} />
    </div>
  );
}

export default ParentComponent;

在这个例子中，Input组件接收三个props：label，value和onChange。label用于显示输入框旁边的文本标签，value用于显示输入框中的值，onChange用于当输入框的值发生改变时更新父组件中的状态。您可以根据需要自定义这些props。