小编Jan*_*kow的帖子
从 React 访问 <body>
我是 React 的新手，我正在尝试构建一个包含“侧边栏中的幻灯片”的独立 Header 组件。我使用 state 来应用 CSS 来滑入/滑出侧边栏：
constructor() {
super();
this.state = {
sideBar: false
}
}
handleSidebar() {
this.setState({
sideBar: !this.state.sideBar
});
}
render() {
return(
<header>
<ul style={this.state.sideBar ? {'transform': 'translateX(0%)'} : null}></ul>
<button onClick={this.handleSidebar.bind(this)}></button>
</header>
)
这在滑动侧边栏方面可以完成工作，但是一旦侧边栏打开，我想通过应用overflow:hidden到<body>. 但是由于<body>在 React 之外，我想知道如何访问标签？
7
推荐指数
推荐指数
1
解决办法
解决办法
1万
查看次数
查看次数
使用 javascript/jquery 删除某个字符后的文本
有没有办法仅在使用 jQuery 或 Javascript 的某个字符之后替换/删除文本？我想删除点 '.' 之后的文本 从一个元素。
2
推荐指数
推荐指数
1
解决办法
解决办法
2万
查看次数
查看次数
Gatsby-使用createRemoteFileNode获取远程图像
我一直在尝试从远程URL获取图像到Gatsby Source File系统，以利用gatsby-image插件的延迟加载。我有一个宁静的API，它返回包含图像URL的字符串的json。由于我是Gatsby Node Api的新手，所以我遵循了该指南，并且不确定如何解决此问题。一切正常，直到使用添加图像的其他属性为止createNodeField。属性似乎已添加（fields当我将fileNode登录到控制台时，我可以看到带有属性的对象。但是，当尝试查询图像时，出现错误：
我想知道我的代码中是否有错误或者是由于gatsby的更改导致的？我正在使用gatsby版本2.0.2。是否有更好的选择以某种方式向图像添加其他属性，以便能够仅查询所需的属性？
这是我的gatsby.node.js样子：
const axios = require('axios');
const { createRemoteFileNode } = require(`gatsby-source-filesystem`);
exports.sourceNodes = ({ actions, createNodeId, node, store, cache } => {
const { createNode, createNodeField } = actions;
const processProject = project => {
project.photos.forEach(async photo => {
let fileNode;
try {
fileNode = await createRemoteFileNode({
url: photo.photo.url,
store,
cache,
createNode,
createNodeId: id => `projectPhoto-${photo.id}`,
});
await createNodeField({
node: fileNode,
name: …2
推荐指数
推荐指数
1
解决办法
解决办法
1465
查看次数
查看次数
在 TypeScript 中输入 react-transition-group 处理程序
我正在尝试输入传递给某些react-transition-group组件的处理程序，例如addEndListenerin <CSSTransition />. 但是我找不到正确键入并避免 TypeScript 错误的方法。
例如。：
<CSSTransition
// TypeScript Error on next line:
addEndListener={(node: HTMLElement, done: () => void) => {
node.addEventListener("transitionend", done, false);
}}
classNames="fade"
>
<div className="button-container">
<Button onClick={() => setState((state) => !state)}>
{state ? "Hello, world!" : "Goodbye, world!"}
</Button>
</div>
</CSSTransition>
react、react-transition-group 和它们的 @types 等价物的版本：
"react": "^16.13.1"
"react-transition-group": "^4.4.1"
"@types/react": "^16.9.43"
"@types/react-transition-group": "^4.4.0"
2
推荐指数
推荐指数
1
解决办法
解决办法
615
查看次数
查看次数