---
title: "Conditional Rendering in LemonadeJS | v5 docs"
description: "LemonadeJS v5 archive. Conditionally control the rendering of DOM elements in your LemonadeJS components using reactive state or properties for dynamic."
source: https://lemonadejs.com/docs/v5/render/
---
# Conditional Rendering in LemonadeJS
LemonadeJS supports conditional rendering through a special attribute: `:render` (or `lm-render`). This allows you to dynamically show or hide sections of the DOM based on boolean conditions, making your components reactive and clean.
## How It Works
You can use the `:render` (or `lm-render`) attribute on a container element. It expects a boolean value. If the value is:
- `true`: the content inside the container is rendered and added to the DOM.
- `false`: the content is removed, leaving only the container itself in the DOM.
This becomes powerful when used with reactive state or component properties to dynamically toggle visibility.
## Attribute Reference
| Attribute | Description |
|---------------|-----------------------------------------------------------------------------|
| `:render` / `lm-render` | Conditionally controls whether the content inside a container is rendered. |
## Examples
### Using Component Properties
This example toggles an input field based on a component’s internal property.
```html
```
```javascript
export default function Component() {
this.test = 'hidden';
const toggle = () => {
this.test = this.test === 'visible' ? 'hidden' : 'visible';
}
return render => render``;
}
```
### Using Reactive `state`
Here’s a version using LemonadeJS’s `state()` to create a reactive in the private context of the component.
#### HTML Script Version
```html
```
```javascript
export default function Test(children, { state }) {
let data = state(false);
const toggle = () => {
data.value = !data.value;
}
return render => render``;
}
```
## What’s Next?
Explore how LemonadeJS simplifies working with forms using reactive data bindings and dynamic field generation.
[Explore Dynamic Forms](/docs/v5/forms/)