我正在尝试在react应用中执行javascript函数，除此特定代码（下文所述）外，其他所有javascript代码段都有效
这是我的ViewBag.message的反应
App.js这是import React, { Component } from "react";
import HomepageBannerArea from './components/homepage-banner-area';
import HomepageNavigationBar from './components/homepage-navigtion-bar';
import HomepageFeatureArea from './components/homepage-feature-area';
import EntireHomepage from './components/entire-homepage';
export default class App extends Component {
render() {
return (
<div>
{/* Homepage navigtion bar */}
<HomepageNavigationBar />
</div>
);
}
}
HomepageNavigationBar.jsx这是import React, { Component } from "react";
import $ from 'jquery'; //un-used
export default class HomepageNavigationBar extends Component {
render() {
return (
<header className="header_area">
<div className="main_menu">
<nav className="navbar navbar-expand-lg navbar-light">
<div className="container">
<a className="navbar-brand logo_h" href="index.html">
<img src="img/logo.png" alt="" />
</a>
<button
className="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span className="icon-bar" /> <span className="icon-bar" />
<span className="icon-bar" />
</button>
.
.
.
//dots used to denote the code is further exists, to make this minimal I have removed them.
</div>
</header>
);
}
}
theme.js这是我正在链接外部alert('hi'); //this alert executes
(function($) { //tis function doesn't execute
"use strict";
var nav_offset_top = $("header").height() + 50;
//* Navbar Fixed
function navbarFixed() {
if ($(".header_area").length) {
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= nav_offset_top) {
alert('Hi');
$(".header_area").addClass("navbar_fixed");
} else {
alert('no Hi');
$(".header_area").removeClass("navbar_fixed");
}
});
}
}
navbarFixed();
})(jQuery);
文件的index.html
theme.js有人可以帮我吗？为什么我的外部js函数不起作用？