# react-hit-miss

**Repository Path**: mirrors_gorangajic/react-hit-miss

## Basic Information

- **Project Name**: react-hit-miss
- **Description**: :dart: jsx conditional rendering inspired by react-router v4
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-09-24
- **Last Updated**: 2026-05-23

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# React Hit Miss Component

[![Build Status](https://semaphoreci.com/api/v1/gorangajic/react-hit-miss/branches/master/badge.svg)](https://semaphoreci.com/gorangajic/react-hit-miss)

> jsx conditional rendering inspired by react-router v4

```
npm install react-hit-miss --save
```

### example

```jsx
import HitMiss, { Hit, Miss } from 'react-hit-miss';

const Awesome = ({ error, items, loading }) => (<HitMiss>
    <Hit
        check={error}
        component={() => (<div>
            {error}
        </div>)}
    />
    <Hit
        check={items && items.length > 0}
        component={() => (<div>
            {items.map(item => <Item {...item} />)}
        </div>)}
    />
    <Hit
        check={loading}
        component={LoadingSpinner}
    />
    <Miss
        component={() => (<div>
            No items found
        </div>)}
    />
</HitMiss>);
```