@quarkunlimit/call-sdk-jx

tiny

用法和 easy-state一样 但是只允许使用 useSelector

import { createStore } from "@quarkunlimit/tiny";
// 推荐和useMethods useImmer 一起使用
import { useMethods } from "@quarkunlimit/react-hooks";
import { useImmer } from "@quarkunlimit/immer";

function useStore(props) {
  const [state, setState] = useImmer({ xxxx });
  const logic = useMethods({
    fn1() {},
    fn2() {},
  });
  const someMemoValue = useMemo(() => {
    xx;
  }, [xxx]);
  // 返回key自己分组 可以不叫state logic memo 可以叫 data methods computed(很vue)
  return {
    props,
    state,
    logic,
    memo: { someMemoValue },
  };
}
const {Provider,useSelector} =  createStore(useStore)
// 组件
const C = memo((props) => {
  return (
    // 将props传递给Provider,就可以在useStore处使用
    <Provider {...props}>
      <你的组件>
    </Provider>
  );
});

const 你的组件 = memo(()=>{
  // 除了方法 其余必须精确到在组件使用的字段
  const someValue = useSelector(x=>x.state.xxx)
  const someProps = useSelector(x=>x.props.xxx)

  // 使用useMethods 包裹的 随便解构,随便玩
  const {fn1,fn2,fn3} = useSelector(x=>x.logic)




  return xxx
})
// 多个store 不需要多个provider,使用qumobx组合方式

function useRootStore(props){
  const a = useA()
  const b = useB()
  const c = useC()
  return {a,b,c,props}
}
const {Provider,useSelector} =  createStore(useRootStore)