J'utilise une bibliothèque appelée FullPage.js (https://github.com/alvarotrigo/react-fullpage) dans mon projet Next.js. Ils ont une classe CSS existante que je souhaite remplacer pour les points secondaires. Cependant, je souhaite uniquement remplacer le CSS pour une page, et c'est le sélecteur CSS suivant. Comment puis-je faire cela?
Merci d'avance pour votre aide !
global.css
#fp-nav > ul > li:last-child > a { display:none }
Page1.jsx
import ReactDOM from "react-dom"; import "fullpage.js/vendors/scrolloverflow"; // 可选项。当使用scrollOverflow:true时 import ReactFullpage from "@fullpage/react-fullpage"; import "./global.css"; class MySection extends React.Component { render() { return ( <div className="section"> <h3>{this.props.content}</h3> </div> ); } } const Page1 = () => ( <ReactFullpage navigation sectionsColor={["#282c34", "#ff5f45", "#0798ec"]} render={({ state, fullpageApi }) => { return ( <div> <MySection content={"从第一页滑下来!"} /> <MySection content={"继续前进!从第一页"} /> <MySection content={"从第一页滑上去!"} /> </div> ); }} /> ); export default Page1;
Page2.jsx
import ReactDOM from "react-dom"; import "fullpage.js/vendors/scrolloverflow"; // 可选项。当使用scrollOverflow:true时 import ReactFullpage from "@fullpage/react-fullpage"; import "./global.css"; class MySection extends React.Component { render() { return ( <div className="section"> <h3>{this.props.content}</h3> </div> ); } } const Page2 = () => ( <ReactFullpage navigation sectionsColor={["#282c34", "#ff5f45", "#0798ec"]} render={({ state, fullpageApi }) => { return ( <div> <MySection content={"从第二页滑下来!"} /> <MySection content={"继续前进!从第二页"} /> <MySection content={"从第二页滑上去!"} /> </div> ); }} /> ); export default Page2;
J'ai trouvé une réponse,
Je viens d'ajouter un sélecteur de requête avec DOM dans useEffect()
Regardez le code ci-dessous