CODEWITHSUNDEEP
reactjsreact-nativereact-navigation
rushabh
rushabh

Reputation: 11

how to pass state to component

I created MExample component in that component i have created this

export default class MExample extends Component {

   _validate() {
          if (validateDate(this.state.choseDate).status) {
          if (validateList(this.state.list).status) {
           var list = this.state.list;
           var choseDate = this.state.choseDate;
           console.log(list+choseDate)
                this.setState({ visibleModal: null , list:[], choseDate:''})
            } else {
                alert("select list date")
             } 
           } else {
            alert("select monthly date ")
          }
      } 
 render() {
   return (
    // jsx
   )}

export default class Mnavigate extends Component {
  render() {
    return (
     <MExample list={this.state.list} choseDate = {this.state.choseDate}/>
      // can i access value like this ?
    )
  }

How to use this.state.list and this.state.choseDate in other component in which i'm importing this component <MExample here i want list and choseDate value />

Upvotes: 1

Views: 144

Answers (2)

Ankit Verma
Ankit Verma

Reputation: 94

You can create properties and pass them as props.

Create a component as below 



 import React, { Component } from 'react'

        class MExample  extends Component {

                   // You can access them via this.props

                validate = () => {
                 console.log(this.prop.list);
                 console.log(this.prop.choseDate);
                } 
                render() {
                   let {list,choseDate} = this.props;            

                    // your code comes here
                    return (
                        <div>

                        </div>
                    )
                }
            }

    export default MExample;

Pass the state in the properties.

<MExample list={this.state.list} choseDate={this.state.choseDate} />

Upvotes: 0

akhtarvahid
akhtarvahid

Reputation: 9769

<MExample list={this.state.list} choseDate={this.state.choseDate} />

and inside MExample component

access through this.props.list and this.props.choseDate

class MExample extends React.Component{
         render(){
          console.log(this.props.list);
          return null;
        }
    }

Upvotes: 2

Related Questions