es6: как импортировать const после экспорта?

Я извиняюсь за отсутствие знаний. Я хочу импортировать значение const внутри файла. У меня дома два файла.JS и стили.JS в том же каталоге.

дома.js

import React from 'react';
import styles from './styles';

const Home = (props) => {

    const HEADER_MAX_HEIGHT = 200;

}

export { HEADER_MAX_HEIGHT };
export default Home;

и в стилях.js

import { StyleSheet } from 'react-native'
import { HEADER_MAX_HEIGHT } from './Home';

export default StyleSheet.create({
    header: {
        height: HEADER_MAX_HEIGHT
    }
});

, но я получаю эту ошибку

не удается найти переменную: HEADER_MAX_HEIGHT

Как я могу получить доступ к этой переменной в стилях.Яш?

11
ecmascript-6 react-native

3 ответов

попробуй:

дома.js

import React from 'react';
import styles from './styles';

export const HEADER_MAX_HEIGHT = 200;

const Home = props => <h1>Home</h1>;

export default Home;

стили.js

import { StyleSheet } from 'react-native';
import { HEADER_MAX_HEIGHT } from './Home';

export default StyleSheet.create({
  header: {
    height: HEADER_MAX_HEIGHT,
  },
});

код HEADER_MAX_HEIGHT должно быть в пределах Home.js файл, но вне

9

вы, вероятно, должны структурировать свой код совершенно по-другому.

хорошим правилом является сохранение всех констант в отдельном файле, вдали от всех представлений.

попробуйте создать файл для всех констант приложения. Constants.js - хороший выбор.

затем поместите константы вот так:

const Constants = {
  HEADER_MAX_HEIGHT: 200,
  OTHER_THINGS: 'whatever'
}
export default Constants

затем вы можете импортировать константы, где вам нужно.

import Constants from '../Folder/Constants'

и как такой

const x = Constants.HEADER_MAX_HEIGHT
18

Это просто правило определения области действия функции!

// Outer scope
const Home = (props) => {
    // Inner scope
    const HEADER_MAX_HEIGHT = 200;

}

console.log(HEADER_MAX_HEIGHT); // Uncaught ReferenceError: HEADER_MAX_HEIGHT is not defined

у вас нет доступа к HEADER_MAX_HEIGHT во внешней области. Поэтому, когда вы пытаетесь экспортировать его, он просто возвращает ошибку.

попробуйте с помощью этого:

import React from 'react';
import styles from './styles';

const HEADER_MAX_HEIGHT = 200;

const Home = (props) => {     
    // ...
}

export { HEADER_MAX_HEIGHT };
export default Home;

Теперь в стилях.js:

import { HEADER_MAX_HEIGHT } from './Home';
2