This simple conditional components only renders its children if the condition prop has a value that is true or truthy in JavaScript. If the condition prop has a value that interpretes as false, nothing (null) will be rendered.
The component renders nothing by itself, it uses React Fragments . All the props and children that you supply to the component gets passed to the div.
Usage:
npm install --save react-simple-conditional
import Conditional from 'react-simple-conditional'
<Conditional condition={someCondition}>
<p>This will be rendered if 'someCondition' is true</p>
</Conditional> import React, { Component } from 'react';
import Conditional from 'react-simple-conditional';
class App extends Component {
state={
renderCondition:true
}
render() {
return (
<Conditional
condition={this.state.renderCondition}>
<h1>Hello World</h1>
</Conditional>
);
}
}
export default App;This project is distributed under the MIT License