小编Isa*_*aac的帖子
如何使用useEffect挂钩注册事件？
我正在学习有关如何使用钩子注册事件的Udemy课程，讲师给出了以下代码：
const [userText, setUserText] = useState('');
const handleUserKeyPress = event => {
const { key, keyCode } = event;
if (keyCode === 32 || (keyCode >= 65 && keyCode <= 90)) {
setUserText(`${userText}${key}`);
}
};
useEffect(() => {
window.addEventListener('keydown', handleUserKeyPress);
return () => {
window.removeEventListener('keydown', handleUserKeyPress);
};
});
return (
<div>
<h1>Feel free to type!</h1>
<blockquote>{userText}</blockquote>
</div>
);
现在效果很好，但我不认为这是正确的方法。原因是，如果我理解正确，那么每次重新渲染时，事件都会每次都在注册和注销，而我根本不认为这样做是正确的方法。
所以我useEffect对下面的钩子做了一些修改
useEffect(() => {
window.addEventListener('keydown', handleUserKeyPress);
return () => {
window.removeEventListener('keydown', handleUserKeyPress);
};
}, []);
通过使用一个空数组作为第二个参数，使组件只运行一次效果，即模仿componentDidMount。当我尝试结果时，奇怪的是，在我键入的每个键上都没有附加，而是被覆盖了。
我期待 …
推荐指数
解决办法
查看次数
将Javascript中的日期减少1天的最简单方法是什么？
我需要将Javascript日期减少1天,以便它正确地回滚数月/年.也就是说,如果我有'今天'的日期,我想得到'昨天'的日期.
当我这样做时,似乎总是需要更多的代码,所以我想知道是否有更简单的方法.
这样做最简单的方法是什么？
[编辑:为了避免在下面的答案中混淆,这是一个JavaScript问题,而不是Java问题.]
推荐指数
解决办法
查看次数
如何解决npm审核修复问题？
????????????????????????????????????????????????????????????????????????????????
? Low ? Prototype Pollution ?
????????????????????????????????????????????????????????????????????????????????
? Package ? lodash ?
????????????????????????????????????????????????????????????????????????????????
? Patched in ? >=4.17.5 ?
????????????????????????????????????????????????????????????????????????????????
? Dependency of ? react-native-cached-image ?
????????????????????????????????????????????????????????????????????????????????
? Path ? react-native-cached-image > lodash ?
????????????????????????????????????????????????????????????????????????????????
? More info ? https://npmjs.com/advisories/577 ?
????????????????????????????????????????????????????????????????????????????????
found 11 vulnerabilities (2 low, 8 moderate, 1 high) in 26316 scanned packages
11 vulnerabilities require manual review. See the full report for details.
当我尝试时npm install，会显示，并且所有这些都需要手动检查。我尝试访问此网站以查看更多信息，这显然是因为我lodash的版本是4.17.4。因此，我随后运行npm install --save …
推荐指数
解决办法
查看次数
我们还需要在 React 钩子中使用函数式 setState 方式吗？
const [count, setCount] = useState(0);
const handleClick = () =>
setCount(prevCount => {
return prevCount + 1;
});
const [count, setCount] = useState(0);
const handleClick = () => setCount(count + 1);
来自基于类的组件背景，它成为我们使用功能性的习惯setState。我想知道我们是否还需要在功能钩子中依赖 prevState ？或者当前状态始终是“可信赖的”和最“更新的”？
推荐指数
解决办法
查看次数
单个 NAT 网关可以跨越多个可用区吗？
当我配置 NAT 网关时，我必须选择一个子网，因此据我所知，一个 NAT 网关对应一个属于一个可用区的子网。
然后我看到了下面的声明
如果您有多个可用区中的资源并且它们共享一个 NAT 网关，如果 NAT 网关的可用区宕机，其他可用区中的资源将无法访问互联网，要创建独立于可用区的架构，请创建一个 NAT 网关并配置您的路由以确保资源使用同一可用区中的 NAT 网关。
如果我在不同的子网中有多个 EC2，它们如何共享一个 NAT 网关？我理解错了吗？下面是我尝试创建 NAT 网关时看到的屏幕截图
推荐指数
解决办法
查看次数
如何使用用户名和密码从私人 gitlab 存储库下载单个原始文件
我可以使用下面的命令克隆带有用户名和密码的私人存储库
git clone https://some-git-lab-token:someHash@git.xxx.com/foo/bar.git
我想知道是否可以使用相同的凭据从同一存储库curl获取wget单个原始文件some-git-lab-token:someHash
示例 gitlab 原始文件 url 如下
https://gitlab.com/athos.oc/lodash-has-plugin/-/raw/master/.eslintrc.json
我尝试如下卷曲单个文件但失败
curl https://some-git-lab-token:someHash@git.xxx.com/foo/bar/-/raw/master/testing.js
我得到的结果如下
<html><body>You are being <a href="https://git.xxx.com/users/sign_in">redirected</a>.</body></html>
推荐指数
解决办法
查看次数
为什么在使用babel-loader时排除node_modules？
网站上询问的大多数问题是如何排除，node_modules但我想知道为什么要排除node_modules？
module.exports = {
mode: 'production',
entry: './src/index.js',
output: {
path: path.join(__dirname, 'dist'),
filename: 'app.bundle.js'
},
module: {
rules: [
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/,
options: {
presets: ['@babel/preset-env']
}
}
]
}
};
有人可以向我解释排除在外的原因node_modules吗？
推荐指数
解决办法
查看次数
如何使用包裹添加图像？
我一直试图添加图像react.我没用webpack,我正在使用parceljs.也用typescript我试试:
import image from path/to/image.png
<img src={image} />
内部反应成分:
尝试: <img src="path/to/image.png" />
尝试: <img src={"path/to/image.png"} />
仍然,不起作用.
代码看起来像这样:
import * as React from 'react';
const componentName = () => (
<div>
<img src="path/to/image.png" />
</div>
);
推荐指数
解决办法
查看次数
React.lazy 会提高 React Native 的性能吗？
我想知道如何React.lazy提高 React-Native 应用程序的性能。
const Warning = React.lazy(() => import('./Warning'));
...
render() {
return (
...
{
{this.state.count > 10 ? (
<React.Suspense fallback={null}>
<Warning />
</React.Suspense>
) : null}
}
)
}
我在 ReactJS 方面了解了上述动态加载 webpack 包，我想知道它是否会在 React Native 方面有所帮助？
本质上，我们将所有 JS 代码捆绑在一起并一起发送到用户设备，所有 JS 代码都已经存在，位于用户设备中。想知道如何React.lazy帮助提高性能，在什么意义上？
推荐指数
解决办法
查看次数
Metro 捆绑程序将生成的 Bundle 存储在哪里？
每当我们尝试在 XCode 上构建 RN 应用程序时，Metro Bundler都会运行一个新实例，我想知道 bundleJs 存储在哪里。
询问的原因是，我想知道以下命令是否不必要
react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios
尝试发布 RN 应用程序时采取的步骤：
1 - 运行上述命令手动生成 JSBundle 文件
2 - 在 XCode 上存档项目
3 - 验证
4 - 上传
简而言之，如果步骤 2 -Archive流程也会启动 Metro Bundler 的新实例，那么步骤 1 似乎是多余的？还是我实际上拿错了图片？
推荐指数
解决办法
查看次数
标签 统计
javascript ×5
reactjs ×5
react-native ×4
react-hooks ×2
webpack ×2
amazon-vpc ×1
babeljs ×1
browser ×1
curl ×1
date ×1
gitlab ×1
lodash ×1
nat ×1
npm ×1
parceljs ×1
wget ×1