1

I am following this question's first answer to create a common parent for two of my components

import React, {Component} from 'react';


    import ButtonSubmit from './ButtonSubmit'
    import Form from './Form'

    export default class ParentofButtonandForm extends Component {

        constructor() {
            super();

            this.state = {
                username: '',
                password : '',

            };
        }

        changeFirst(receivedUN,reaceivedPW) {
            this.setState({
                username: receivedUN,
                password:reaceivedPW
            });
        }

        render() {
            return (

                <Form username={this.state.username} password={this.state.password} changeFirst={this.changeFirst.bind(this)}/>
                <ButtonSubmit username={this.state.username} password={this.state.password}/>

            )

        }
    }

But i get unrechable code error in

<ButtonSubmit username={this.state.username} password={this.state.password}/>

I dont know what i am doing wrong. I also get a ':expected' warning in this.state.username.

PuskarShestha
  • 755
  • 1
  • 7
  • 19

1 Answers1

1

You are returning two components from render functions. Either you wrap <Form> and <Button> into another component, may be View OR you can return a component array from render function.

Wrapping inside View

render() {
   return (
        <View>
            <Form .../>
            <ButtonSubmit .../>
        </View>
   )
}

Returning array of components, link

render() {
    return [
       <Form .../>,
       <ButtonSubmit .../>
    ];
}

Hope this will help!

Prasun
  • 4,943
  • 2
  • 21
  • 23