Git Product home page Git Product logo

Comments (2)

fantasticsoul avatar fantasticsoul commented on August 21, 2024 1
  • 方法1,使用顶层api getState(moduleName?:string)获得
import { getState } from 'concent';

export function someReducerFn(){
  const barState = getState('bar');//获得bar模块状态
}
  • 方法2,从actionCtx里直接获取, 推荐此方法
    可留意type文档IActionCtxBase 描述如下
export interface IActionCtxBase {
  callerModule: string;
  module: PropKey;
  committedStateMap: IAnyObj,
  committedState: IAnyObj,
  invoke: typeof refCtxInvoke;
  lazyInvoke: typeof refCtxInvoke;
  dispatch: typeof refCtxDispatch;
  lazyDispatch: typeof refCtxDispatch;
  rootState: IAnyObj;
  globalState: IAnyObj;
  moduleState: IAnyObj;
  moduleComputed: IAnyObj;
  setState: (obj: IAnyObj) => Promise<IAnyObj>;
  refCtx: IAnyObj;
}

从描述可看出rootState就是整个根状态,所以你在任意模块reducer方法的actionCtx里即可取到

import { getState } from 'concent';

export function someReducerFn(payload, moduleState, actionCtx){
  const barState = actionCtx.rootState.bar;//获得bar模块状态
}

bay the way,如果想在foo模块的reducer方法里调用bar模块的reducer方法去改变bar模块的状态有3种方法

  • 方法1,利用dispatch字符串匹配模式
// code in models/foo/reducer.js

// 同步调用
export async function someReducerFn(payload, moduleState, actionCtx){
  const ret = await actionCtx.dispatch('bar/someMethod', {val:'this is payload'});
}

// 异步调用
export function someReducerFn(payload, moduleState, actionCtx){
  actionCtx.dispatch('bar/someMethod', {val:'this is payload'});
}
  • 方法2,直接将对应方法引入过来
// code in models/foo/reducer.js
import * as barRd from 'models/bar/reducer';

// 同步调用
export async function someReducerFn(payload, moduleState, actionCtx){
  const ret = await actionCtx.dispatch(barRd.someMethod, {val:'this is payload'});
}

// 异步调用
export function someReducerFn(payload, moduleState, actionCtx){
  actionCtx.dispatch(barRd.someMethod, {val:'this is payload'});
}
  • 方法3,使用顶层reducer对象发起调用,run接口启动concent后,所有reducer方法都会收集到一个根Reducer对象上
// code in models/foo/reducer.js
import { reducer } from 'concent';

// 同步调用
export async function someReducerFn(payload, moduleState, actionCtx){
  const ret = await reducer.bar.someMethod({val:'this is payload');
}

// 异步调用
export function someReducerFn(payload, moduleState, actionCtx){
  reducer.bar.someMethod({val:'this is payload');
}

此种方法不推荐,因为会失去追踪源头调用处的能力(从哪个ui实例发起的调用),当然如果用户不在乎复盘源头调用处那么就无所谓了

此方法更适合在开发模式下,打开console,输入cc.reducer.***即可调用所有模块的各个reducer方法快速验证某些逻辑。

from helux.

fantasticsoul avatar fantasticsoul commented on August 21, 2024

已解决

from helux.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.