Widzę, że wszystko jest w porządku:
const Tab = connect( mapState, mapDispatch )( Tabs );
export default Tab;
Jest to jednak niepoprawne:
export default const Tab = connect( mapState, mapDispatch )( Tabs );
Ale to jest w porządku:
export default Tab = connect( mapState, mapDispatch )( Tabs );
Czy można to wyjaśnić, dlaczego const
jest nieważny export default
? Czy jest to niepotrzebny dodatek i cokolwiek zadeklarowane jako export default
domniemane const
?
export default Tab = connect( mapState, mapDispatch )( Tabs );
powinno byćexport default connect( mapState, mapDispatch )( Tabs );
. Eksportujesz wynik wywołania funkcji, a nie zmienną Tab.Odpowiedzi:
const
jest jaklet
, to jest Deklaracja Lexical ( VariableStatement, Deklaracja ) używana do definiowania identyfikatora w twoim bloku.Próbujesz połączyć to ze
default
słowem kluczowym, które oczekuje , że podąży za nim deklaracja HoistableDeclaration, ClassDeclaration lub AssignmentExpression .Dlatego jest to błąd SyntaxError .
Jeśli chcesz
const
czegoś, musisz podać identyfikator, a nie używaćdefault
.export
sam przyjmuje zmienne oświadczenie lub deklarację po swojej prawej stronie.AFAIK sam eksport nie powinien niczego dodawać do twojego obecnego zakresu.
Tab
staje się wyrażeniem AssignmentExpression, ponieważ ma domyślną nazwę ?Tutaj
Tab = connect( mapState, mapDispatch )( Tabs );
jest AssignmentExpression .źródło
"AFAIK the export in itself should not add anything to your current scope"
To nie jest tak dokładne, ponieważexport const a = 1
dodajea
do twojego obecnego kontekstu. I nawetexport default
w przypadku klas, ponieważ równieżexport default class MyClass {}
dodajeMyClass
do twojego obecnego kontekstu.let a; export default a;
a następnie zaktualizuję zmienną a, gdy już została zaimportowana do innego modułu, dlaczego domyślna zmienna eksportu nie zostanie zaktualizowana?const foo = function bar() {}
, a takżeconst Foo = class Bar {}
, ale nieconst foo = const bar = 1
. To samo dotyczyexport default
, tak po prostuconst foo =
.Możesz również zrobić coś takiego, jeśli chcesz wyeksportować domyślną const / let zamiast
Możesz zrobić coś takiego, czego osobiście nie lubię.
źródło
Jeśli nazwa komponentu jest wyjaśniona w nazwie pliku
MyComponent.js
, po prostu nie nazywaj komponentu, kod pozostanie wąski.Aktualizacja : Ponieważ jest to nieznane w śledzeniu stosu, nie jest zalecane
źródło
Unknown
wszędzie tam, gdzie domyślny jest eksport bez nazwyOdpowiedź Paula jest tą, której szukasz. Jednak ze względów praktycznych myślę, że możesz być zainteresowany wzorcem, którego używałem w moich własnych aplikacjach React + Redux.
Oto uproszczony przykład z jednej z moich tras, pokazujący, jak można zdefiniować komponent i wyeksportować go jako domyślny za pomocą pojedynczej instrukcji:
(Uwaga: używam terminu „Scena” dla komponentu najwyższego poziomu dowolnej trasy).
Mam nadzieję, że to jest pomocne. Myślę, że jest znacznie czystszy niż konwencjonalny
connect( mapState, mapDispatch )( BareComponent )
źródło
@connect
jest jedynym dekoratorem, którego używam, używam go tylko z komponentami, które są podłączone do magazynu redux, prawie każda z nich jest „trasą” i prawie każda trasa powinna mieć stan (i dlatego nie może być czystą funkcją) .Odpowiedź udzielona przez Paula jest najlepsza. Aby rozwinąć więcej,
Może być tylko jeden domyślny eksport na plik. Podczas gdy może być więcej niż jeden stały eksport. Zmienną domyślną można zaimportować pod dowolną nazwą, natomiast zmienną const można zaimportować o określonej nazwie.
Po stronie importu musimy go zaimportować w następujący sposób:
lub
Przy pierwszym imporcie zmienna const jest importowana, podczas gdy przy drugim importowana jest zmienna domyślna.
źródło
default
jest w zasadzieconst someVariableName
Nie potrzebujesz nazwanego identyfikatora, ponieważ jest to domyślny eksport pliku i możesz go nazwać, kiedy chcesz, podczas importowania, więc
default
po prostu kondensuj przypisanie zmiennej do jednego słowa kluczowego.źródło
Dla mnie jest to tylko jedna z wielu osobliwości (nacisk na idio (t)) maszynopisu, który powoduje, że ludzie wyciągają włosy i przeklinają twórców. Być może mogliby opracować bardziej zrozumiałe komunikaty o błędach.
źródło