react component: how to set a key only attribute from props?

user_709439 0
Viewed 49

I am building a simple react-native component, which uses itself a component which requires an attribue which is only a key. For example:

export default class MyComponent extends Component {
  render() {
    return (
      <LineChart bezier />
    );
  }
}

The component my component uses is LineChart, which expects an attribute like bezier.
I don't know how I could pass this attribute to LineChart in a dynamic way, i.e. using a prop... I did try something like:

<LineChart this.props.interpolation />

But this is not syntactically valid.

Any clue?

react-native reactjs javascript
2 Answers

"key only props" are actually booleans.

So when you do <Component bezier /> you are just saying the same as <Component bezier={true} /> in a shorter way.

If you want to have it dynamic, you can do something like

const { bezier, interpolation } = this.props;

return <Component bezier={bezier} interpolation={interpolation} />

PS: considering that the values inside props will be booleans.

user_51900630

I have used functional component in which i pass key like that

<LineChart bezier={Your_DATA}/>
user_75399270
Related