Objekte sind nicht als untergeordnetes Reakt gültig (gefunden: Objekt mit Schlüsseln {$$ typeof, type, key, ref, requisiten, _owner, _store}). Wenn Sie eine Sammlung von untergeordneten Objekten darstellen möchten, verwenden Sie stattdessen ein Array oder wickeln Sie das Objekt mit createFragment (object) aus den React-Add-Ons ein. Überprüfen Sie die Render-Methode von
App
.
AppContainer:
const mapDispatchToProps = (dispatch) => {
return {
}
}
}
}
Komponente:
class App extends Component {
render() {
return (
);
}
}
Oben ist meine Renderfunktion für app.js. Dieser Code funktioniert in Google Chrome einwandfrei, aber wenn er zu Internet Explorer kommt, funktioniert er nicht und es wird der obige Fehler ausgegeben.
Wenn Sie immer noch dieses Problem haben, schauen Sie sich this reagieren Ausgabe # 8379 über React 15.4 und IE11 ..__ an. Ich hatte das gleiche Problem mit webpack dev mode/IE11/React 15.4 und es scheint so React und ReactDom verwenden jeweils ihre Version einer Symbol-Polyfill (dies ist neu mit 15.4):
Irgendwie "reagieren" und "reagieren" nicht mehr auf den
$$typeof
-Wertwas sollte
typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103
sein.
Ich habe dieses Problem behoben, indem Sie polyfill
und react
/react-dom
neu angeordnet haben, um sicherzustellen, dass das Polyfill-Symbol vor React und ReactDom-Symbol geladen wird.
Beispiel für Webpack:
entry: [
'babel-polyfill', // Load this first
'react-hot-loader/patch', // This package already requires/loads react (but not react-dom). It must be loaded after babel-polyfill to ensure both react and react-dom use the same Symbol.
'react', // Include this to enforce order
'react-dom', // Include this to enforce order
'./index.js' // Path to your app's entry file
]
In meinem Fall mit React Native haben wir diesen mysteriösen Bug über Wochen hinweg auf Android-Builds ohne eingebauten Debugger gezogen.
Der Täter war ein
import 'core-js'
an unserer Wurzelkomponente scheint es, dass polyfill die Dinge durcheinander gebracht hat
Die Lösung bestand darin, es einfach zu entfernen, da es in meinem Fall nicht mehr erforderlich ist
Relevanter Teil von package.json
"react-native": "0.44.2",
"react": "16.0.0-alpha.6",
Mein Problem war, dass Babel-Polyfill über meinem Reaktions-Hot-Loader liegen musste. React und ReactDom, die erforderlich waren, um babel-polyfill im Webpack-Eintrag aus den in diesem Kommentar beschriebenen Gründen vorzustellen:
https://github.com/facebook/react/issues/8379#issuecomment-263962787 .
Sah so aus:
dev:
entry: [
'babel-polyfill',
'react-hot-loader/patch',
`webpack-dev-server/client?${localhost}:${PORT}`,
'webpack/hot/only-dev-server',
PATHS.app
]
produktion:
entry: [
'babel-polyfill',
'react',
'react-dom',
PATHS.app
]
Vorher...
dev:
entry: [
'react-hot-loader/patch',
`webpack-dev-server/client?${localhost}:${PORT}`,
'webpack/hot/only-dev-server',
'babel-polyfill',
PATHS.app
]
produktion:
entry: [
'babel-polyfill',
PATHS.app
]
Mein Problem war dasselbe und verwendete React Native und testete die Android-App auf einem ABD-Gerät/Emulator .
Nachdem Sie die oben genannten Vorschläge zum Entfernen von 'core-js' und zum Hinzufügen von gesehen haben
entry: [
'babel-polyfill', // Load this first
'react-hot-loader/patch', // This package already requires/loads react (but not react-dom). It must be loaded after babel-polyfill to ensure both react and react-dom use the same Symbol.
'react', // Include this to enforce order
'react-dom', // Include this to enforce order
'./index.js' // Path to your app's entry file
]
in Android/app/build.gradle-Datei wurde mein Problem nicht gelöst. Da ich keine der Importanweisungen wie import 'core-js' oder importiere 'babel-polyfill' hatte mein code
**
Lösung:
** Beim Entfernen der Importanweisung wurde der import 'core-js' hinzugefügt. zu meinem Stammverzeichnis, das index.js war. Durch manuelles Hinzufügen der Bibliothek über den Befehl Prompt/Terminal .. __ Dies hat mein Problem gelöst.
In meinem Fall habe ich mein Projekt mit react-slingshot gestartet und dies ist eine Lösung, die für mich funktioniert hat
# from https://github.com/facebook/create-react-app/tree/master/packages/react-app-polyfill
$ npm install react-app-polyfill --save
Dann in der webpack.config.js
-Datei
entry: [
'react-app-polyfill/ie11', // <==== Important line and must be loaded before you code does
path.resolve(__dirname, 'src/index.js')
],
target: 'web',
mode: 'development',
plugins: [
...
Die vollständige Dokumentation finden Sie hier: -react-app-polyfill
Ich hoffe, das funktioniert auch für euch!