嘿,我有一个反应功能组件,看起来像这样
Nessus determined the server is unpatched and is not using any
of the suggested workarounds by making the following requests :
-------------------- Testing for workarounds --------------------
HEAD /search/stylesheets/style.css HTTP/1.1
Host: xxx (I have removed it)
Accept-Charset: iso-8859-1,utf-8;q=0.9,*;q=0.1
Accept-Language: en
Request-Range: bytes=5-0,1-1,2-2,3-3,4-4,5-5,6-6,7-7,8-8,9-9,10-10
Range: bytes=5-0,1-1,2-2,3-3,4-4,5-5,6-6,7-7,8-8,9-9,10-10
Connection: Keep-Alive
User-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0)
Pragma: no-cache
Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, image/png, */*
HTTP/1.1 206 Partial Content
Date: Fri, 08 Jun 2018 01:46:15 GMT
Server: Apache
X-Powered-By: Express
Accept-Ranges: bytes
Cache-Control: public, max-age=0
Last-Modified: Mon, 28 May 2018 09:11:04 GMT
ETag: W/"5630-163a603e954"
Content-Type: text/css; charset=UTF-8
Content-Range: bytes 1-10/22064
Content-Length: 10
X-FRAME-OPTIONS: SAMEORIGIN
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
-------------------- Testing for workarounds --------------------
-------------------- Testing for patch --------------------
HEAD /search/stylesheets/style.css HTTP/1.1
Host: xxx (I have removed it)
Accept-Charset: iso-8859-1,utf-8;q=0.9,*;q=0.1
Accept-Language: en
Request-Range: bytes=0-,1-
Range: bytes=0-,1-
Connection: Keep-Alive
User-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0)
Pragma: no-cache
Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, image/png, */*
HTTP/1.1 206 Partial Content
Date: Fri, 08 Jun 2018 01:46:20 GMT
Server: Apache
X-Powered-By: Express
Accept-Ranges: bytes
Cache-Control: public, max-age=0
Last-Modified: Mon, 28 May 2018 09:11:04 GMT
ETag: W/"5630-163a603e954"
Content-Type: text/css; charset=UTF-8
Content-Range: bytes 0-22063/22064
Content-Length: 22064
X-FRAME-OPTIONS: SAMEORIGIN
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
-------------------- Testing for patch --------------------
这里我想在桌面上隐藏一个按钮import React from 'react';
import Classes from './toolbar.css';
import Logo from '../../logo/logo.js';
import Navitems from '../navigation-items/navigation-items.js';
const toolbar = (props) => {
return (
<header className={Classes.Toolbar}>
<div className={Classes.SideDrawerVisibility}>
<button onClick={props.sideDrawerTogglerHandler}> Click Me </button>
</div>
<div className={Classes.Logo}>
<Logo height="100%"/>
</div>
<nav className={Classes.DesktopOnly}>
<Navitems />
</nav>
</header>
)
}
export default toolbar;
,即这行JSX
click me
在我的Css中我做过类似的事情
<div className={Classes.SideDrawerVisibility}>
<button onClick={props.sideDrawerTogglerHandler}> Click Me </button>
</div>
但按钮仍然可见并且可以在桌面和移动设备上工作,对我可能做错了什么的想法?
答案 0 :(得分:0)
您无法导入css类选择器,例如import Classes from './toolbar.css';
。
您必须将className
prop的值设为字符串。
改变你的道具,
<div className="SideDrawerVisibility">
<button onClick={props.sideDrawerTogglerHandler}> Click Me </button>
</div>
并导入为,
import './toolbar.css';
你可以看到它有效。