React.js / CRA, как вызвать или импортировать функцию javaScript из другого файла? - PullRequest
0 голосов
/ 22 февраля 2019

Мой код становится длиннее, поэтому я решил перенести их в другой файл javaScript.

Я следовал этой соответствующей теме относительно моего вопроса , но почему я получаю ошибку, я просто копирую и вставляювсе?

В приведенной выше ссылке приведен код

//slideshow.js
function plusSlides(n) {
    showSlides(slideIndex += n);
}

//Home.js
class NextButton extends React.Component {
    constructor() {
        super();
        this.onClick = this.handleClick.bind(this);
    }

    handleClick (event) {
        script.plusSlides(1); // I don't know how to do this properly...
    }

    render() {
        return (
            <a className="next" onClick={this.onClick}>
                &#10095;
            </a>
        );
    } 
}

Это моя ошибка «Попытка импорта при импорте:« plusSlides »не экспортируется из файла ../plusSides».

Я использовал React.js CRA есть что-то, что мне нужно настроить, чтобы это исправить?

Ответы [ 2 ]

0 голосов
/ 24 июля 2019

Вы действительно даете пробел, за которым следует слово «файл» ??Не думаете ли вы, что он должен быть импортирован как:

import plusSlides из '../plusSides';

Кроме того, посмотрите, что вы экспортируете из этого файла,Если это импорт по умолчанию, вы можете импортировать его под любым именем, в противном случае вы должны указать одинаковые имена при экспорте и импорте.Помните, вы можете сделать только один экспорт по умолчанию для файла.

0 голосов
/ 22 февраля 2019

Должно быть, это сработало.Единственное, что вам нужно, это Babel для транспорта es6 (который, как я полагаю, у вас есть, так как вы использовали реакцию CRA).Есть еще один способ сделать это, то есть использовать экспорт по умолчанию

slideshow.js

export default (n)=>{
    showSlides(slideIndex += n);
}

и импортировать эту функцию следующим образом в Home.js

Home.js

import anyname from './slideshow.js' //I am assuming you have slideshow.js and Home.js in same directory

handleClick (event) {
    anyname(1); 
}
...