android-从v1迁移到react-native-navigation v2后,发生不变违规

前端之家收集整理的这篇文章主要介绍了android-从v1迁移到react-native-navigation v2后,发生不变违规 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

启动后从v1迁移到v2后,我在Android上遇到了Invariant Violation.我该如何解决

  1. Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.
  2. Check the render method of `ReduxWrapper`.
  3. This error is located at:
  4. in ReduxWrapper (at renderApplication.js:35)
  5. in RCTView (at View.js:45)
  6. in View (at AppContainer.js:98)
  7. in RCTView (at View.js:45)
  8. in View (at AppContainer.js:115)
  9. in AppContainer (at renderApplication.js:34)
  10. createFiberFromTypeAndProps
  11. createFiberFromElement
  12. reconcileSingleElement
  13. TouchableNativeFeedback.android.js:257:31
  14. reconcileChildFibers
  15. reconcileChildren
  16. VirtualizedList.js:911:10
  17. finishClassComponent
  18. VirtualizedList.js:439:28
  19. updateClassComponent
  20. VirtualizedList.js:1404:41
  21. performUnitOfWork
  22. workLoop
  23. NativeModules.js:32:36
  24. renderRoot
  25. NativeModules.js:98:6
  26. performWorkOnRoot
  27. MessageQueue.js:312:11
  28. performWork
  29. performSyncWork
  30. requestWork
  31. scheduleWork
  32. defineLazyObjectProperty.js:35:19
  33. scheduleRootUpdate
  34. deepFreezeAndThrowOnMutationInDev.js:59:4
  35. render
  36. renderApplication
  37. run
  38. runApplication
  39. __callFunction
  40. SharedElement.js:20:28
  41. <unknown>
  42. LayoutTreeCrawler.js:4:21
  43. __guard
  44. callFunctionReturnFlushedQueue
  45. callFunctionReturnFlushedQueue
  46. [native code]

我已经尝试隔离问题,并检查是否采取了正确的步骤进行迁移,但无法找出问题所在.

  1. import {Provider} from "react-redux";
  2. import {Navigation} from "react-native-navigation";
  3. import {registerScreens} from "./screens";
  4. import configureStore from "./store/configureStore";
  5. export const store = configureStore();
  6. registerScreens(store,Provider);
  7. Navigation.events().registerAppLaunchedListener(() => {
  8. initApp().then(() => {
  9. Navigation.setRoot({
  10. root: {
  11. stack: {
  12. children: [{
  13. component: {
  14. name: "app.Login"
  15. }
  16. }],options: {
  17. topBar: {
  18. title: {
  19. text: ""
  20. }
  21. }
  22. }
  23. }
  24. }
  25. }).catch(function (reason) {
  26. console.error("Screen creation Failed",reason);
  27. }); }
  28. );
  29. });
  30. async function initApp() {
  31. ...
  32. }

这是index.android.ts文件.

  1. import {Navigation} from "react-native-navigation";
  2. import LoginController from "./modules/controller/LoginController";
  3. export function registerScreens(store: any,provider: any) {
  4. Navigation.registerComponentWithRedux("app.Login",() => LoginController,store,provider);
  5. }

这是screens.ts文件.

  1. ...
  2. "dependencies": {
  3. "@react-native-community/async-storage": "^1.2.4","@react-native-community/netinfo": "^2.0.0","abortcontroller-polyfill": "^1.1.9","babel-plugin-transform-remove-console": "^6.9.4","crypto-js": "^3.1.9-1","dateformat": "latest","immutable": "latest","moment-timezone": "^0.5.21","node-fetch": "^2.1.2","react": "16.8.3","react-native": "0.59.1","react-native-android-location-services-dialog-Box": "^2.8.0","react-native-background-timer": "^2.1.1","react-native-check-Box": "^2.1.0","react-native-cli": "^2.0.1","react-native-device-info": "^0.25.1","react-native-elements": "^0.19.1","react-native-keyboard-aware-scroll-view": "^0.8.0","react-native-mail": "^3.0.6","react-native-material-textfield": "^0.12.0","react-native-navigation": "^2.18.3","react-native-permissions": "^1.1.1","react-native-settings-list": "^1.8.0","react-native-swipe-list-view": "^1.5.1","react-native-swipeable": "^0.6.0","react-native-textinput-effects": "^0.5.1","react-native-vector-icons": "^6.2.0","react-native-version-check": "^3.0.3","react-redux": "^5.1.1","redux": "^4.0.1","redux-immutable-state-invariant": "^2.1.0","redux-logger": "^3.0.6","redux-persist": "^5.10.0","redux-thunk": "^2.3.0","remote-redux-devtools": "^0.5.16","rn-placeholder": "^1.3.3"
  4. },"devDependencies": {
  5. "@babel/core": "^7.4.3","@babel/plugin-proposal-class-properties": "^7.4.0","@babel/plugin-proposal-decorators": "^7.4.0","@babel/plugin-transform-object-assign": "^7.2.0","@babel/plugin-transform-runtime": "^7.4.3","@babel/preset-env": "^7.4.3","@babel/preset-react": "^7.0.0","@babel/preset-typescript": "^7.3.3","@babel/runtime": "7.4.3","@types/chai": "^4.1.7","@types/enzyme": "^3.1.12","@types/enzyme-adapter-react-16": "^1.0.2","@types/enzyme-redux": "^0.2.2","@types/jest": "^23.3.0","@types/json-schema": "^7.0.1","@types/moment-timezone": "^0.5.12","@types/react": "^16.4.6","@types/react-native": "^0.57.29","@types/react-native-background-timer": "^2.0.0","@types/react-native-material-textfield": "^0.12.3","@types/react-native-navigation": "^1.1.12","@types/react-native-settings-list": "^1.8.1","@types/react-native-vector-icons": "^6.4.0","@types/react-redux": "^7.0.0","@types/react-test-renderer": "^16.0.1","@types/redux-test-utils": "^0.2.0","babel-jest": "^24.7.1","babel-preset-react-native-stage-0": "^2.0.0-alpha.1","babel-runtime": "^7.0.0-beta","chai": "^4.1.2","enzyme": "^3.9.0","enzyme-adapter-react-16": "^1.11.2","enzyme-redux": "^0.2.1","jest": "24.7.1","jest-spec-reporter": "^1.0.5","jsdom": "^14.0.0","metro-react-native-babel-preset": "^0.53.1","react-dom": "^16.8.5","react-native-mock": "^0.3.1","react-native-typescript-transformer": "^1.2.12","react-test-renderer": "^16.8.3","redux-test-utils": "^0.3.0","ts-jest": "^24.0.1","tslint": "^5.10.0","typescript": "^3.4.1","typescript-babel-jest": "^1.0.6"
  6. },...

package.json中的依赖项.

我遵循了迁移指南,并希望它能正常工作.

https://wix.github.io/react-native-navigation/#/docs/top-level-api-migration

最佳答案
我发现了错误.
我使用了过时的方式注册屏幕.我认为已弃用意味着仍在工作.

Navigation.registerComponentWithRedux(“ app.Login”,()=> LoginController,商店,提供商);

应该:

  1. Navigation.registerComponent("app.Login",() => (props) => (
  2. <Provider store={store}>
  3. <LoginController {...props} />
  4. </Provider>
  5. ),() => LoginController);

猜你在找的Android相关文章