https://github.com/slavamuravey/vorarbeiter-react
:link: React bindings for Vorarbeiter :link:
https://github.com/slavamuravey/vorarbeiter-react
react react-bindings vorarbeiter
Last synced: about 1 year ago
JSON representation
:link: React bindings for Vorarbeiter :link:
- Host: GitHub
- URL: https://github.com/slavamuravey/vorarbeiter-react
- Owner: slavamuravey
- License: mit
- Created: 2025-01-25T16:16:37.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-30T16:51:25.000Z (about 1 year ago)
- Last Synced: 2025-02-26T06:38:34.535Z (about 1 year ago)
- Topics: react, react-bindings, vorarbeiter
- Language: TypeScript
- Homepage:
- Size: 67.4 KB
- Stars: 5
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## React bindings for Vorarbeiter
### Installation
```shell
npm install vorarbeiter-react
```
To use Vorarbeiter service container in React application pass service container into provider:
### Basic usage
```typescript
import React, { FC } from "react";
import { createServiceContainer, createServiceSpecBuilder, ServiceContainer } from "vorarbeiter";
import { ServiceContainerProvider } from "vorarbeiter-react";
import { ServiceImpl } from "./path/to/service/impl";
import { App } from "./path/to/app";
export const RootComponent: FC = () => {
const sb = createServiceSpecBuilder();
sb.set("someService", () => new ServiceImpl());
const serviceContainer = createServiceContainer(sb.getServiceSpec());
return (
);
};
```
#### Get service container inside functional component
```typescript
import React, { FC } from "react";
import { useServiceContainer } from "vorarbeiter-react";
import { Service } from "./path/to/service";
const MyComponent: FC = () => {
const serviceContainer = useServiceContainer();
const someService: Service = serviceContainer.get("someService");
return (
{someService.someFieldValue}
);
};
```
#### Get service container inside class component
```typescript
import React from "react";
import { withServiceContainer } from "vorarbeiter-react";
import { Service } from "./path/to/service";
const MyComponent = withServiceContainer(class MyComponent extends React.Component {
render() {
const { serviceContainer } = this.props;
const someService: Service = serviceContainer.get("someService");
return (
{someService.someFieldValue}
);
}
});
```