w4ngzhen 最近的时间轴更新 w4ngzhen 最近的时间轴更新 |
w4ngzhenV2EX 第 302965 号会员，加入于 2018-03-24 13:16:30 +08:00今日活跃度排名 19268 |
compilemind.com
| 发展焦虑：三条路怎么选？ 职场话题 • w4ngzhen • 1 天前 • 最后回复来自 jimrok | 36 |
| 请完成实名认证以便使用 Gitee Pages 服务
2 程序员 • w4ngzhen • 2022-09-30 19:57:33 PM • 最后回复来自 autulin
|
61 |
| 虚心请教，这样的 React 面试题目是否合理？ React • w4ngzhen • 2022-09-06 16:31:02 PM • 最后回复来自 likunyan | 51 |
| 真是服了巨硬的翻译了 分享发现 • w4ngzhen • 2021-11-29 11:23:09 AM • 最后回复来自 xz410236056 | 13 |
| 关于《Scala 编程（3rd）》中， 20.6 抽象类型 P424 的疑问 Scala • w4ngzhen • 2019-07-04 17:32:20 PM • 最后回复来自 madeye | 18 |
w4ngzhen 最近回复了
2 天前 回复了 w4ngzhen 创建的主题 › 职场话题 › 发展焦虑：三条路怎么选？ |
感谢各位大佬的回复，我也认真看了，不一一感谢回复了🙏
2 天前 回复了 w4ngzhen 创建的主题 › 职场话题 › 发展焦虑：三条路怎么选？ |
@aotemannew 感谢老哥的分享
2 天前 回复了 w4ngzhen 创建的主题 › 职场话题 › 发展焦虑：三条路怎么选？ |
@emSaVya 哈哈哈，假设嘛
2 天前 回复了 w4ngzhen 创建的主题 › 职场话题 › 发展焦虑：三条路怎么选？ |
@xujiahui 你这思路牛，但是如果 2. 机会不等人呢。比如现在 2. 还有机会，但是等到 1. 裁员了的时候 2. 已经没坑了。
2 天前 回复了 w4ngzhen 创建的主题 › 职场话题 › 发展焦虑：三条路怎么选？ |
@guaguaguaxia1 这是一个问题，哈哈
2 天前 回复了 w4ngzhen 创建的主题 › 职场话题 › 发展焦虑：三条路怎么选？ |
不知道在主题上怎么 append 了，补充下：现在已经有一套房子了。路线 3 是指把现在房子卖了，回去养老。
20 天前 回复了 Asuler 创建的主题 › React › 请教一个 react hook 的问题 |
@meta575 你说的这种也是正确的处理方式，通过封装无状态的方法，在多个 type 变化的地方调用也是解决方案。
20 天前 回复了 Asuler 创建的主题 › React › 请教一个 react hook 的问题 |
“那我就需要把 aHandle 和 bHandle 放入依赖项中,否则 eslint 或者 sonarlint 会报警告” —— eslint 具体的警告是什么？感觉你这种场景是很常见的。aHandle 和 bHandle 有什么特殊之处吗？
20 天前 回复了 Asuler 创建的主题 › React › 请教一个 react hook 的问题 |
另外，useEffect 一定要分两步看：它“吃”了一个匿名函数，但是不意味着它立刻会调用；调用的时机取决 React 所的定义的依赖判定。
20 天前 回复了 Asuler 创建的主题 › React › 请教一个 react hook 的问题 |
```jsx
const App = () => {
const [count, setCount] = useState(1);
const handle = () => {
console.log('做些事');
}
useEffect(() => {
handle();
}, [count])
return <button onClick={() => setCount(count + 1)}>Add One</div>
}
```
感觉大家没有回答到点上啊。首先，React 中的函数式组件，每“运行”一次，是一个时刻的结果。比如上面的 App 函数，完成一次加载以后。实际上就是运行了一次 App 函数，对于第一次视为 t1 ，t1 流程是：
1. 初始化了一个 count 的 state
2. 通过变量`handle`定义了一个函数
3. 执行了一次 useEffect
4. 返回了一个`<button />`
这里面最关键的点是步骤 3 执行 useEffect 。在第一次运行的时候，这个匿名方法：
```js
// t1 时刻的匿名函数
() => {
handle(); // t1 时刻的 handle 变量
}
```
被 React 存放到了内部，并且它捕获了 t1 时刻的变量`handle`，并且，通过`[count]`定义了依赖项。并且，t1 的匿名函数会执行一次。
当你点击按钮的时候，由于调用了 setCount ，在上述场景下，会导致 App 重新执行一次，我们把第二次执行的流程视为 t2 。它的过程是：
1. 由于第 2 次了，useState 拿到的值不再是初始值，而是上一次 set 的值，在上面的例子是 2 ；
2. 通过变量`handle`定义了一个函数。这里的 handle ，跟 t1 阶段的 handle 完全是两个变量，它们仅仅是名字一样，代码块一样而已。
3. 执行一次 useEffect 。此时，生成了一个 t2 时刻的匿名函数：
```js
// t2 匿名
() => {
handle(); // 这里的 handle 也是 t2 时刻的 handle ，跟 t1 的 handle 没有任何关系
}
```
此时，t1 的 count = 1 与 t2 的 count = 2 不一样了，所以，useEffect 中的匿名函数（ t2 版本）会执行一次，handle 自然就是 t2 版本的 handle 。
另外，上述场景中的 handle 能用 count 这个 state 吗？当然可以，因为 t2 时刻的 handle 捕获的是 t2 时刻的 count 。
const App = () => {
const [count, setCount] = useState(1);
const handle = () => {
console.log('做些事');
}
useEffect(() => {
handle();
}, [count])
return <button onClick={() => setCount(count + 1)}>Add One</div>
}
```
感觉大家没有回答到点上啊。首先，React 中的函数式组件，每“运行”一次，是一个时刻的结果。比如上面的 App 函数，完成一次加载以后。实际上就是运行了一次 App 函数，对于第一次视为 t1 ，t1 流程是：
1. 初始化了一个 count 的 state
2. 通过变量`handle`定义了一个函数
3. 执行了一次 useEffect
4. 返回了一个`<button />`
这里面最关键的点是步骤 3 执行 useEffect 。在第一次运行的时候，这个匿名方法：
```js
// t1 时刻的匿名函数
() => {
handle(); // t1 时刻的 handle 变量
}
```
被 React 存放到了内部，并且它捕获了 t1 时刻的变量`handle`，并且，通过`[count]`定义了依赖项。并且，t1 的匿名函数会执行一次。
当你点击按钮的时候，由于调用了 setCount ，在上述场景下，会导致 App 重新执行一次，我们把第二次执行的流程视为 t2 。它的过程是：
1. 由于第 2 次了，useState 拿到的值不再是初始值，而是上一次 set 的值，在上面的例子是 2 ；
2. 通过变量`handle`定义了一个函数。这里的 handle ，跟 t1 阶段的 handle 完全是两个变量，它们仅仅是名字一样，代码块一样而已。
3. 执行一次 useEffect 。此时，生成了一个 t2 时刻的匿名函数：
```js
// t2 匿名
() => {
handle(); // 这里的 handle 也是 t2 时刻的 handle ，跟 t1 的 handle 没有任何关系
}
```
此时，t1 的 count = 1 与 t2 的 count = 2 不一样了，所以，useEffect 中的匿名函数（ t2 版本）会执行一次，handle 自然就是 t2 版本的 handle 。
另外，上述场景中的 handle 能用 count 这个 state 吗？当然可以，因为 t2 时刻的 handle 捕获的是 t2 时刻的 count 。
Select Language