UseContext传递信息(props)

父组件:content.js
import Son1 from './Son1' //引入子组件
import { useState,createContext } from 'react'

export const CountContext = createContext({}) //创建数据源

function Father(){
	let [title, setTitle] = useState('公共数据')
 	const changeCom = (value) => {
    	setTitle((title = value))
    }
	return (
    <>
     //使用CountContext.Provider包裹子组件 value 是公共使用的数据  
     //可以通过传递函数进行你想要的一些操作
     // CountContext也就是你上面自己取的名字
     changeCom(value) }}>
      	
      
      
    
  )
}
export default Father

子组件:Son1.js
import { useContext } from 'react'
import { CountContext } from './content'  // 关键

// props={text}
function Son1(){
	let data = useContext(CountContext) // 获取公共数据  关键
	return (
    <>
      

{data.title}

//使用公共数据 ) } export default Son1

你可能感兴趣的:(javascript,前端,react.js)