我正在使用一個名為 nextparticle 的 javascript 庫。我正在嘗試在 React.js 中實作它。我到處尋找并嘗試了所有選項，但我無法讓它作業。我試過這個。
import React, {Component } from 'react'
import { NextParticle } from '../nextparticle';
import {Helmet} from "react-helmet";
const Background = () => (
<div>
<Helmet>
<script src="../nextparticle.js" type="text/javascript" />
</Helmet>
<NextParticle />
</div>
);
這是我得到的錯誤
Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
我也試過import NextParticle from '../nextparticle';
也不起作用。我已經試了好幾天了。我應該傳遞特殊引數才能使其作業。我嘗試放置的任何引數都不起作用。這應該是這樣的
<img
id="logo"
src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/23500/nextparticle.png"
/>
<script src="https://nextparticle.nextco.de/nextparticle.min.js"></script>
<script>
nextParticle = new NextParticle({
image: document.all.logo,
addTimestamp: true,
width: window.innerWidth,
height: window.innerHeight,
initPosition: 'none',
initDirection: 'none',
});
});
window.onresize = function () {
if (window.innerWidth > 600) {
nextParticle.width = window.innerWidth - 20;
nextParticle.height = window.innerHeight - 20;
nextParticle.start();
}
};
</script>
我還在我的 index.html 中添加了這個
<script src="/nextparticle.min.js"></script>
再次，沒有結果。這是圖書館的檔案任何幫助表示贊賞，謝謝。
uj5u.com熱心網友回復：
我猜你必須使用export你的背景組件，因為這就是錯誤所提到的。
import React, {Component } from 'react'
import { NextParticle } from 'nextparticle';
import {Helmet} from "react-helmet";
export const Background = () => (
<div>
<Helmet>
<script src="../nextparticle.js" type="text/javascript" />
</Helmet>
<NextParticle />
</div>
);
如果你想匯入第三方腳本，React直接在你的匯入它index.html。通常在public目錄中。除非你真的需要Helmet。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/354663.html
標籤：javascript 反应 进口 成分 使成为
下一篇：導航欄上重復的漢堡選單圖示