Js 如何去修改 react组件的内容

#1

求大神 带带 :dizzy_face:

#2

通过高阶组件 反向继承来获取react组件内容，重新解析，包装等处理后，再返回

#3

高阶组件、反向继承、重新解析、包装，说点简单易懂的词吧。。

#4

React 设计思想是不允许js直接操作react组件中内容的。

组件中可变的地方都存放在this.state。组件内部通过其他方式从外部获取数据，然后由组件自身去修改this.state。达到修改内容的方式。

所以换个思路想想吧。

#5

请问 有这方面的列子吗 我才学react没多久 高阶组件还没咋用过

#6

关键是看提供的链接原文

#7

在组件生命周期componeDidMount 里面是是可以用jquery来操作DOM的。但react不推荐这么做，react实现页面更新一般就两种方式：改变state，或者改变props。建议学习react基础。我之前看的是阮一峰的react技术栈，希望对你有用

#8

两个方案，一个是cloneElement

import { cloneElement } from 'react'

function MyComponent({children, ...props}) {
  const otherProps = {...}
  return cloneElement(children, {...props, ...otherPops })
}

<MyComponent><OtherComponent {...} /></MyComponent>

另一个方案，高阶组件

function wrap(OldComponent) {
  return function NewComponent(props) {
    const otherProps = {...}
    return <OldComponent {...props} {...otherProps} />
  }
}

......

class MyComponent extends Component { ... }
export default wrap(MyComponent)
1 Like
#9

谢谢 我去找找

#10

这个问题解决了 不过我是直接使用 别人写好的方法

#11

也可以看看deep-into-react 高阶组件这个例子