I am totally new to react, I have sign up form which have 5 five input fields.

I created one functional component for TextField

**MyTextField.js**

```
function MyTextField(props) {
    return (
        <TextField 
            label={props.label} 
            name={props.name}
            placeholder={props.placeholder} 
            type={props.type}
            onChange={props.handleOnChange}
            value={props.value}
        ></TextField>
    )
}
export default MyTextField

```

**Signup.js**

```
function SignUp() {

    const [value, setValue] = useState('')

    function FunConfirmPassword(event) {
        setValue = event.target.value //this function is calling, if I comment this line
        console.log('FunConfirmPassword called - password value = '+ value)
    }
    return (
        <MyTextField type="text"  label="Firstname" name="firstName" placeholder="Enter Firstname"></MyTextField>
        <MyTextField type="text"  label="Lastname" name="Lastname" placeholder="Enter Lastname"></MyTextField>
        <MyTextField type="text"  label="emailID" name="emailID" placeholder="Enter emailID"></MyTextField>
        <MyTextField type="password"  label="password" name="password" placeholder="Enter password"></MyTextField>

        <MyTextField handleOnChange={FunConfirmPassword}  type="password"  label="confirmpassword" name="confirmpassword" placeholder="Enter confirmpassword"></MyTextField>

    )
}

```

I am trying to learn how to set the value of TextField and get the value of same textfield.

At the same time, it must be re-usable function