React
1.子组件的props的值分别通过一下方式进行初始化赋值:
//
1. const [title2, setstate] = useState(props.title)
2. const { title } = props
那么现在改变父组件中 title的值, 子组件的值是否会同步更新?
const { title } = props 会同步更新 这里是值的引用
const [title2, setstate] = useState(props.title) 这里不会同步更新, 因为useState 每次得到的都说一个新值
全部代码如下:
// 父组件
import Data from '../components/data'
export default function index() {
const [title, setTitle] = useState('测试')
setTimeout(()=> {
setTitle('测试1')
},2000)
return (
<div>
父组件
<Data title={title}></Data>
</div>
)
}
// 子组件
export default function data(props) {
const [title2, setstate] = useState(props.title)
const { title } = props
useEffect(() => {
console.log(title + 'title')
}, [title])
useEffect(() => {
console.log(title2 + 'state')
}, [title2])
return (
<div>
{title}--- title <br /> {/* 实时更新 */}
{title2} --- title2 {/* 非实时更新 */}
</div>
)
}