Я конвертирую статический сайт в gatbsyjs, есть плагин js, который я не могу заставить работать: https://github.com/gijsroge/priority-navigation.
Это сценарий только для клиента, поэтому я использую альтернативную процедуру установки для обхода узла.
Это моя процедура:
- В html.js я загружаю скрипт из «статической» папки, затем инициализирую его.
<script src={withPrefix('priority-nav.js')} />
<script
dangerouslySetInnerHTML={{
__html: `
console.log('start!');
var nav = priorityNav.init({});
console.log(nav);
console.log('end!');
`,
}}
/>
{props.postBodyComponents}
</body>
- my page.js довольно прямолинейно:
import React from "react"
import '../../node_modules/priority-nav/dist/priority-nav-core.css'
const IndexPage = () => (
<nav className="nav-wrapper">
<ul className="nav-ul" style={{display:"inline-block", border: "1px solid blue"}}>
<li style={{display:"inline-block", padding:"0 100px", border: "1px solid red"}}>list item</li>
<li style={{display:"inline-block", padding:"0 100px", border: "1px solid red"}}>list item</li>
<li style={{display:"inline-block", padding:"0 100px", border: "1px solid red"}}>list item</li>
<li style={{display:"inline-block", padding:"0 100px", border: "1px solid red"}}>list item</li>
</ul>
</nav>
)
export default IndexPage
В визуализированном html загружаются файлы .js и .css. Но на элемент nav
скрипт воздействует.
Должно ли что-то подобное работать?