你们遇到过的觉得比较烂的 react 代码大概长什么样？

[luffy]

我自己臆想下，大概可能有几个方面

1. 一个超级大的组件，几千行代码堆在一起。
2. 组件有一堆参数，并且完全不知道参数代码什么意思，甚至连参数本身的命名风格都不统一。
3. 完全违反了函数式编程的重要法则： 副作用太多，失控。debug 搞半天都不知道是哪个变量出的问题。
4. 同样功能，同类型的逻辑到处都是，同一款轮子一遍又一遍的被制造出来。大概是为了多创造些就业机会吧？
5. 无用的 div/css 太多了。 ...

这些你们有遇到过嘛？或者有别的，我没想到的？

[shisang]

第一条无法忍受，其他都可以自己改。一个几千行代码的组件你要把代码看清楚都费劲

[Ritr]

这 5 条都很难搞啊，关键是第一条太难搞了

[Twinkle]

哎，现在接手项目的代码全中，连缩进都不是统一的，命令行上百个 warning 。

[relaxgo]

哎，现在接手项目的代码全中，连缩进都不是统一的，命令行上百个 warning 。

[liyang5945]

我前同事之前离职跑路，给我留下一个一万多行的组件，这几条全中，只不过是 vue 的，到现在我都没搞清楚完整的逻辑，碰到 bug 只能慢慢找

[huai]

在类组件的方法里，转发 this （.call .apply)

[nito]

ref 滥用，父组件调用子组件函数，数据流混乱，违背单向数据流的思想。

[wanguorui123]

XML 里一堆业务逻辑无法调试

[meteor957]

@nito 看场景吧，不想违背单向数据流的话，很多时候状态要提升到父组件。容易造成性能问题，并且也造成父组件 state 庞大。

[meteor957]

以前碰到过 所有组件的状态(包括 visible 显隐这种)全部放在 redux 中，然后一层一层往下传，props 对象滚到几百行，及其痛苦。

[ColdBird]

@Twinkle VsCode 有全文件执行格式化的插件

[murmur]

我觉得我们写的就差不多，没用 redux ，都是 event

[ColdBird]

@meteor957 目前的项目也有一部分是这样的，所有状态都在最顶层，一层一层传一下去，维护起来真是头痛

[1sm23]

@nito #7 那父组件想调子组件方法怎么办

[cenx]

大概是这样？

```
<Vue
data={{ nums: [1, 2, 3] }}
template={`
<div v-for="num in nums">
{{num}}
</div>
`}
/>
```

[DOLLOR]

增、改、查，三个页面代码不复用，每次维护工作量 x3 。

[Bojackk]

react ，文件后缀 js ，一个页面 5k-8k 行，一个 Modal 写了两遍，初始化一个，更新一个。
目前的屎山，完全力不从心。

[einq7]

@1sm23 #14 同问，我知道一种办法。函数组件可以通过 useImperativeHandle 让你在使用 ref 时自定义暴露给父组件的方法。不过这个实践好像不符合 react 哲学

[Leviathann]

@1sm23 把下面的组件状态提升到上面，再把修改状态的方法传给下面调用

[gaoryrt]

有了 react 还用 jq