父传子,子传父,跨组件传值
父传子:
App.js:
import React, {
Component } from 'react'
import Com1 from './components/com1'
import Com2 from './components/com2'
export default class App extends Component {
constructor(){
super()
this.state = {
count:1
}
}
render() {
return (
<div>
this is app
<Com1 count={
this.state.count}></Com1>
<Com2 count={
this.state.count}></Com2>
</div>
)
}
}
Com1.js:
import React from 'react'
export default function com1(props) {
return (
<div>
this is com1 --- 无状态组件---App传递过来的数据---{
props.count}
</div>
)
}
Com2.js:
import React, {
Component } from 'react'
export default class com2 extends Component {
render() {
console.log(this.props)
return (
<div>
this is com2 --- 有状态的组件,App以属性方式传递来的数据 ---{
this