Dva: كيفية مسح معلومات الإعادة؟

فكرت في طريقة لكتابة طريقة عامة ، وإلغاء تسجيل النموذج ، app.unmodel(namespace) ، ثم إعادة التسجيل app.model(model)

اكتب مخفض خاص للمسح؟

xufei飞 姐 ، dva لفترة طويلة ، هل تقوم بحركة كبيرة؟

في الأعمال الفعلية ، يكون للعديد من النماذج حالة أولية ، وببساطة يكون إفراغ كائنات البيانات في الحالة عرضة للمشكلات.
نهجنا هو استنساخ الحالة الأولية للنموذج عند إنشاء نموذج ، ثم إضافة مخفض إعادة تعيين الحالة لكل نموذج افتراضيًا (في طريقة إعادة التعيين ، سيتم تحديث البيانات الأولية المستنسخة إلى الحالة). بعد التنظيف ، فقط أرسل الإجراء المقابل (xxx / resetState).
ولكن إذا كانت إعادة تعيين عالمية ، فإنها تظل مؤلمة للغاية ، حيث يمكن إرسال إجراء واحد فقط لكل نموذج ، ولكن هذا الطلب لم يتم الوفاء به بعد.

يبدو أن هذا لا ينبغي أن يحدث. يجب أن يكون لمعلومات التهيئة الخاصة بالحرم الجامعي الأول إجراء ، أليس كذلك؟ ألا يجب استدعاء هذا الإجراء عند التبديل بين الحرم الجامعي؟ حتى إذا قمت بإعادة ضبط الحالة بالكامل ، ألا يجب أن تتم تهيئتها تلقائيًا بعد الإجراء عند تبديل الحرم الجامعي؟

laketeazjxpcycxufei المشتركة مع آرائكم، وأعتقد أنه لا يزال من الضروري استخدام مباشرة العمل لتهيئة البيانات.

يضيف كل نموذج طريقة إعادة تحميل ، وبعد التبديل ، يتم مسح كل منها.

dicklwm لا يعرف ما إذا كان unmodel سيكون له آثار. لذلك ما زلت أشير إلى نهجهم وأسمح لكل نموذج بإعادة تحميل البيانات بشكل مباشر.

شكرا لكم جميعا.

ومع ذلك ، على المدى القصير ، ما زلت أستخدم القوة الغاشمة لإعادة تحميل الصفحة مباشرة. أضفه مرة أخرى عندما تجد طريقة أفضل.

إذا تم إعادة تعيين الحالة بالكامل ، فإن طريقة

// const initialState = ...;
const app = dva({
  onReducer: reducer => {
    return (state, action) => {
      if (action.type === 'RESET') {
        return initialState;
      }
      return state;
    };
  }
});
// Usage
dispatch({ type: 'RESET' });

لقد بحثت عنه من الإنترنت واتبعت رمز xufei 老大 لفترة طويلة ، لكنني لم أتمكن من تشغيله. لقد استغرق اكتشاف الموقف وقتًا طويلاً. عند استخدام onReducer ، بالإضافة إلى إعادة الحالة الجديدة ، تحتاج أيضًا إلى إعادة التوجيه.ارجع إلى كود dva / test / تخفيضات-test.js

يعتمد مشروعي على antd-pro ويحتاج إلى إضافة ملفين app.js و initialState.js ضمن الدليل src .

أولاً ، حدد الحالة الأولية في ملف ./src/initialState.js .

import defaultSettings from './defaultSettings';

export default {
  setting: defaultSettings,
  loading: {
    effects: {},
  },
  global: {
    layout: 'basic', // Page layout switch (options: basic | map)
    collapsed: false,
    notices: [],
  },
  login: {
    status: false,
    authority: 'guest',
  },
  register: {
    status: false,
  },
}

بعد ذلك ، احكم على الخطاف onReducer في الملف ./src/app.js ، وأعد تعيين شجرة الحالة عندما يكون action.type هو RESET .

import initialState from './initialState';

// eslint-disable-next-line
export const dva = {
  config: {
    initialState,
    onReducer(reducer) {
      return (state, action) => {
        const newState = action.type === 'RESET' ? initialState : reducer(state, action);
        return { ...newState, routing: newState.routing };
      };
    },
  },
};

وبهذه الطريقة ، يمكنك استخدامه مباشرة حيث تريده (مثل تسجيل الخروج) ، مثل تعديل عملية تسجيل الخروج من القائمة العلوية antd-pro ./src/layouts/Header.js :

class HeaderView extends PureComponent {
  ...

   handleMenuClick = ({ key }) => {
    ...

    if (key === 'logout') {
      dispatch({ type: 'RESET' });
      dispatch({ type: 'login/logout' });
    }
  };

  ...
}

هل من الممكن حفظ الحالة الأولية في بداية التطبيق كبيانات إعادة تعيين؟

تضمين التغريدة

مرحبًا ، لقد تابعت ما كتبته ، وتم الإبلاغ عن خطأ في وقت التشغيل: لم يتم اكتشافه (في الوعد) تعذر العثور على مخفض جهاز التوجيه في شجرة الحالة ، يجب تثبيته ضمن "جهاز التوجيه"

بمعنى ، التوجيه ليس في كائن الحالة الأولية. أين يجب تحديد ذلك؟

shangdevlaozhu dva ظهر هذا بعد الترقية index.js:1 uncaught at _callee Could not find router reducer in state tree, it must be mounted under "router"
الرمز هو نفسه

لقد بحثت عنه من الإنترنت واتبعت رمز xufei 老大 لفترة طويلة ، لكنني لم أتمكن من تشغيله. لقد استغرق اكتشاف الموقف وقتًا طويلاً. عند استخدام onReducer ، بالإضافة إلى إعادة الحالة الجديدة ، تحتاج أيضًا إلى إعادة التوجيه.ارجع إلى كود dva / test / تخفيضات-test.js

يعتمد مشروعي على antd-pro ويحتاج إلى إضافة ملفين app.js و initialState.js ضمن الدليل src .

أولاً ، حدد الحالة الأولية في ملف ./src/initialState.js .

import defaultSettings from './defaultSettings';

export default {
  setting: defaultSettings,
  loading: {
    effects: {},
  },
  global: {
    layout: 'basic', // Page layout switch (options: basic | map)
    collapsed: false,
    notices: [],
  },
  login: {
    status: false,
    authority: 'guest',
  },
  register: {
    status: false,
  },
}

بعد ذلك ، احكم على الخطاف onReducer في الملف ./src/app.js ، وأعد تعيين شجرة الحالة عندما يكون action.type هو RESET .

import initialState from './initialState';

// eslint-disable-next-line
export const dva = {
  config: {
    initialState,
    onReducer(reducer) {
      return (state, action) => {
        const newState = action.type === 'RESET' ? initialState : reducer(state, action);
        return { ...newState, routing: newState.routing };
      };
    },
  },
};

وبهذه الطريقة ، يمكنك استخدامه مباشرة حيث تريده (مثل تسجيل الخروج) ، مثل تعديل عملية تسجيل الخروج من القائمة العلوية antd-pro ./src/layouts/Header.js :

class HeaderView extends PureComponent {
  ...

   handleMenuClick = ({ key }) => {
    ...

    if (key === 'logout') {
      dispatch({ type: 'RESET' });
      dispatch({ type: 'login/logout' });
    }
  };

  ...
}

هل لديك رمز كامل لهذا؟ بعد تحديد dva في app.js ، أين استدعيت أو بدأت؟

يمكن لـ laozhu إزالة تعريف initialState ، عندما يكون action.type RESET ، استخدم البيانات التي تمت تهيئتها مباشرةً reducer({},{type:'@<strong i="9">@INIT</strong>'})

export const dva = {
  config: {
    onReducer(reducer) {
      return (state, action) => {
        const newState = action.type === 'RESET' ? reducer({},{type:'@<strong i="12">@INIT</strong>'}) : reducer(state, action);
        return { ...newState, routing: newState.routing };
      };
    },
  },
};

عندما تحتاج جميع الطرز إلى إعادة الضبط

class HeaderView extends PureComponent {
  ...

   handleMenuClick = ({ key }) => {
    ...

    if (key === 'logout') {
      dispatch({ type: 'RESET' });
      dispatch({ type: 'login/logout' });
    }
  };

  ...
}

• إذا كنت ترغب في إعادة تعيين الحالة ضمن مساحة اسم معينة ، فما عليك سوى إرسال المخفض المقابل لتلك الحالة.

• إذا كنت تريد إعادة تعيين جميع الدول ضمن مساحة اسم

 onReducer(reducer) {
    let initialState: any = null;
    return (state: any, action: any) => {
      let newState: any = reducer(state, action);
      if (action.type === "@@INIT") {
        initialState = newState; //缓存所有初始state
      }

      const actionTypeArr: string[] = action.type.split("/");

      if (actionTypeArr.length === 1 && action.type === "reset") {
        newState = initialState;
      }

      if (actionTypeArr.length > 1) {
        const namespace = actionTypeArr[0];
        const postfix = actionTypeArr[actionTypeArr.length - 1];
        const modelState = initialState[namespace];
        if (postfix === "reset" && modelState) {
          newState = {
            ...newState,
            [namespace]: modelState
          }; //重置某个namespace的state,直接dispacth({type:"{namespace}/reset"})
        }
      }

      return newState;
    };
  }

• إذا كنت ترغب في إعادة تعيين الحالة ضمن مساحة اسم معينة ، فما عليك سوى إرسال المخفض المقابل لتلك الحالة.
• إذا كنت تريد إعادة تعيين جميع الدول ضمن مساحة اسم

 onReducer(reducer) {
    let initialState: any = null;
    return (state: any, action: any) => {
      let newState: any = reducer(state, action);
      if (action.type === "@@INIT") {
        initialState = newState; //缓存所有初始state
      }

      const actionTypeArr: string[] = action.type.split("/");

      if (actionTypeArr.length === 1 && action.type === "reset") {
        newState = initialState;
      }

      if (actionTypeArr.length > 1) {
        const namespace = actionTypeArr[0];
        const postfix = actionTypeArr[actionTypeArr.length - 1];
        const modelState = initialState[namespace];
        if (postfix === "reset" && modelState) {
          newState = {
            ...newState,
            [namespace]: modelState
          }; //重置某个namespace的state,直接dispacth({type:"{namespace}/reset"})
        }
      }

      return newState;
    };
  }

action.type === "INIT" لقد غيرت إلى action.type.indexOf ('redux / INIT') === 0

dva-reset-state عبارة عن مكون إضافي ، فقط خذها واستخدمها ، يمكنك الرجوع إليها