Как подключить свой js скрипт к компоненту React.js?

Question

[ayapergenov]

Есть компонент Accordion в который надо подключить самописный js скрипт.
Нахожу только инструкции подключения библиотек через npm.

import React, { Component } from 'react';
import './Accordion.css';

class Accordion extends Component {
    render() {
        return (
                <aside className="accordion">
                    <h1>News</h1>
                    <div className="opened-for-codepen">

                    </div>
                </aside>
        );
    }
}

export default Accordion;

Comments

[Иван Минаков]

а что мешает использовать import 'твой компонент'?

Answer 1

[Artyom]

Подключить его так же как и остальные файлы \ компоненты.
import myOwnScript from './myOwnScript.js';

При этом в файле myOwnScript.js должен быть экспорт, вроде такого:

const MathMax = (a, b) => {
  return Math.max(a,b);
}
export default MathMax;

В зависимости от нfстройки вебпака (если вы им собираете) ".js" писать не нужно

Comments

[konstantinst13]

Доброго времени суток!
Как вставить JS-скрипт в классовый компонент Реакта и сделать так, чтобы скрипт запускался только в тот момент, когда этот компонент уже смонтирован и физически есть в ДОМе. Как мне это сделать? Благодарю за внимание.

[Latnove]

Я нашел решение, но оно не идеальное (тупое) и подходит не всем, нужно в js файл сам код, где идет присвоение, закинуть в SetTimeout() и поставить таймер например 10ms, и после все нормально работает

Answer 2

[Coder321]

Если это обычный js файл то вариантов много, скопировать его и преобразовать в модуль, подключить его на index, настроить webpack

Comments

[konstantinst13]

Доброго времени суток!
Как вставить JS-скрипт в классовый компонент Реакта и сделать так, чтобы скрипт запускался только в тот момент, когда этот компонент уже смонтирован и физически есть в ДОМе. Как мне это сделать? Благодарю за внимание.