hox: React Hooks状态管理器

model

import { useState } from "react";
import { createModel } from "hox";

function useCounter() {
    const [count, setCount] = useState<number>(0);
    const decrement: () => void = () => setCount(count - 1);
    const increment: () => void = () => setCount(count + 1);
    return {
        count,
        decrement,
        increment
    };
}

export default createModel(useCounter);

use model

import React from "react"
import useCounterModel from "../../models/counter";

const Home:React.FC = () => {

    const counter = useCounterModel()
    const { count, decrement, increment} = counter

    return (
        <div>
            <div>Home</div>
            <div>
                <p>{count}</p>
                <button onClick={decrement}>decrement</button>
                <button onClick={increment}>increment</button>
            </div>
        </div>
    )
}

export default Home
©️2020 CSDN 皮肤主题: 像素格子 设计师:CSDN官方博客 返回首页