Obwohl es eine ähnliche Frage gibt, kann ich keine Datei mit mehreren Funktionen erstellen. Ich bin mir nicht sicher, ob die Methode bereits veraltet ist oder nicht, da sich RN sehr schnell entwickelt. Wie erstelle ich eine globale Hilfsfunktion in React Native?
Ich bin neu bei React Native.
Ich möchte eine js-Datei mit vielen wiederverwendbaren Funktionen erstellen, sie dann in Komponenten importieren und von dort aus aufrufen.
Was ich bisher gemacht habe, mag dumm aussehen, aber ich weiß, dass Sie danach fragen werden, also hier sind sie.
Ich habe versucht, einen Klassennamen Chandu zu erstellen und ihn so zu exportieren
'use strict';
import React, { Component } from 'react';
import {
AppRegistry,
Text,
TextInput,
View
} from 'react-native';
export default class Chandu extends Component {
constructor(props){
super(props);
this.papoy = {
a : 'aaa'
},
this.helloBandu = function(){
console.log('Hello Bandu');
},
}
helloChandu(){
console.log('Hello Chandu');
}
}
Und dann importiere ich es in eine beliebige Komponente.
import Chandu from './chandu';
Und dann nenne es so
console.log(Chandu);
console.log(Chandu.helloChandu);
console.log(Chandu.helloBandu);
console.log(Chandu.papoy);
Das einzige, was funktioniert hat, war das erste console.log, was bedeutet, dass ich den richtigen Pfad importiere, aber keine anderen.
Was ist der richtige Weg, um dies bitte zu tun?
quelle
import functions from './helpers'
.functions. HelloChandu
wird da sein. Funktionen ist ein Objekt, das alle Funktionen enthält. Lesen Sie hier mehr über den Export :) developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…new
eine Klasse nur für statische Eigenschaften erstellen? Exportieren Sie in diesem Fall eine FunktionEine Alternative besteht darin, eine Hilfsdatei zu erstellen, in der Sie ein const-Objekt mit Funktionen als Eigenschaften des Objekts haben. Auf diese Weise exportieren und importieren Sie nur ein Objekt.
helpers.js
Dann importieren Sie wie folgt:
und verwenden Sie wie folgt:
quelle
helper2: function(param1){ helpers.helper1(); }
Ich bin sicher, das kann helfen. Erstellen Sie fileA an einer beliebigen Stelle im Verzeichnis und exportieren Sie alle Funktionen.
Hier in Ihrer React-Komponentenklasse können Sie einfach eine Importanweisung schreiben.
quelle
Um das zu erreichen, was Sie möchten, und eine bessere Organisation Ihrer Dateien zu erreichen, können Sie eine index.js erstellen, um Ihre Hilfsdateien zu exportieren.
Angenommen, Sie haben einen Ordner namens / helpers . In diesem Ordner können Sie Ihre Funktionen nach Inhalten, Aktionen oder anderen Elementen erstellen.
Beispiel:
Erstellen wir eine weitere Datei mit Funktionen, die Ihnen bei Tabellen helfen:
Der Trick besteht nun darin, eine index.js im Ordner " helpers " zu haben:
Jetzt können Sie dann separat importieren, um jede Funktion zu verwenden:
Ich hoffe, es kann helfen, Ihre Dateien besser zu organisieren.
quelle
Ich bevorzuge es, einen Ordner zu erstellen, dessen Name Utils ist, und einen Seitenindex zu erstellen, der das enthält, was Sie für hilfreich halten
Wenn Sie dies verwenden müssen, sollte es als "{}" importiert werden, da Sie nicht das Standard-Keyword-Look verwendet haben
quelle
Wenn Sie class verwenden möchten, können Sie dies tun.
Helper.js
App.js.
quelle