0.0.4 • Published 3 years ago

enjeu v0.0.4

Weekly downloads
-
License
ISC
Repository
github
Last release
3 years ago

enjeu

The bridge between @vue/reactivity and react

import { FC } from "react";
import { useVueRef, useVueRefs, useVueReactive } from "enjeu";
import { ref, reactive } from "@vue/reactivity";

// Ref's and reactive objects declares ONLY
// outside react functional component
// or in React.Context
const counter = ref(0);
const store = reactive({
    counter: 0
});
const counters = [ref(0), ref(0)];

const App: FC = () => {
    useVueRef(counter);
    useVueRefs(counters);
    useVueReactive(store);

    return (
      <div>
        <div onClick={() => counter.value += 1}>Ref Counter: { counter.value }</div>
        <div onClick={() => counters[0].value += 1}>Refs Counters: { counters[0].value + " " + counters[1].value }</div>
        <div onClick={() => store.counter += 1}>Reactive counter: { store.counter }</div>
      </div>
    );
}

export default App;