mixspa-preact

Mixspa-preact is a wrapper for mixspa-core.

Current Status:

What it come from?

Pleas reference here: mixspa-core

Apis for this library

createApp: create a mixspa app.

import { createApp } from '@mixspa/preact';
import { BrowserRouter } from 'preact-router-dom';
import App from './App';

createApp(
  'app-tag',
  (props) => (
    <BrowserRouter baseName={ props.baseName }>
      <App />
    </BrowserRouter>
  )
);

AppLoader: load a mixspa app.

import { AppLoader } from '@mixspa/preact';

const Loading = () => <div>Loading...</div>

const Content = () => (
  <div>
    <AppLoader appId="appId" loading={ Loading }/>
  </div>
);

EventLink: This link will send a event to event bus.

import { EventLink } from '@mixspa/preact';

const NavBar = () => (
  <div>
    <EventLink to="/menu-a"/>
    <EventLink to="/menu-b"/>
  </div>
);

EventHolder: Receive event and handle url change event.

import preactDOM from 'preact-dom';
import { BrowserRouter } from 'preact-router-dom';
import { Route, Switch } from "preact-router-dom";
import { EventHolder } from '@mixspa/preact';

preactDOM.render(
  <BrowserRouter>
    <EventHolder>
      <Switch>
        <Route path="/test-a"/>
        <Route path="/test-b"/>
      </Switch>
    </EventHolder>
  </BrowserRouter>,
  document.getElementById('app')
);

License

mixspa-preact is released under the MIT license.