2

I have following functionality in React Native app

const GreenWood = ({x,y,z,f1,f2, f3}) => {
  ...
}

I need to convert it to class

class GreenWood extends Component {
  constructor(props) {
      super(props);
  }
  ...
}

But my props x, y, x are undefined. How to propely forward them?

sigrlami
  • 1,822
  • 1
  • 17
  • 35
  • May I advise reading the following [guide](https://facebook.github.io/react/docs/components-and-props.html), and [this possible related question](http://stackoverflow.com/questions/38202572/understanding-react-redux-and-mapstatetoprops) and looking into mapDispatchToProps? – Hodrobond Jan 13 '17 at 00:17
  • Well i read that guide, it describes "functional" way that I'm trying to move from, but not the one I need. Also, I'm not using Redux, just creating the component and want to forward some props. In other languages this usually done in constructors. – sigrlami Jan 13 '17 at 00:31

2 Answers2

5

I'm guessing you have a functional component GreenWood that returns some JSX.

class Greenwood extends React.Component {
  constructor(props) {
   super(props)
   //...whatever construction you need
  }
  render() {
   const { x, y, z, f1, f2, f3 } = this.props
   return // your JSX Here
  }
}
Kevin Velasco
  • 4,568
  • 1
  • 16
  • 6
0

I don't think you can destructure props on classes. You would have to add this.props in front of all those variables, or inside the method you are using it do:

var { x, y, z, f1, f2, f3 } = this.props

or just put the ones you are using inside that method.

Matt Aft
  • 8,742
  • 3
  • 24
  • 37
  • can I do like this after super in the constructor? I tried to do this.x = props.x; but without success – sigrlami Jan 13 '17 at 00:27
  • You can do this.x = this.props.x, since you converted to class you have to put 'this' in front of props. – Matt Aft Jan 13 '17 at 00:31