react 父組件與子組件之間的值傳遞的方法

import React, { Component } from 'react'

export default class Item extends Component {
 constructor(props) {
 super(props)

 this.state = {
 prices: 0
 }
 }

 handleChange(){
 const prices =800;
 this.setState({
 prices: price
 })
 //用傳過來的changePrice屬性(props)，是個函數(shù)，呼叫它把price交給父組件中的函數(shù)去處理
 this.props.changePrice(price)
 }

 render() {
 const { prices } = this.state;
 return (
 <div>
 <div onChange={this.handleChange.bind(this)}>
 </div>
 <p>{prices}</p>
 </div>
 )
 }
}

import React, { Component } from 'react';
import Item from './Item'

class App extends Component {
 constructor(props) {
 super(props)

 this.state = {price: 0}
 }
 
 //給子組件用來傳price用的方法
 changePrice(price){
 this.setState({price: price})
 }

 render() {
 return (
 <div>
 <Item changePrice={this.changePrice.bind(this)}/>
 <p>{this.state.price}</p>
 </div>
 );
 }
}

export default App;