码迷,mamicode.com
首页 > 其他好文 > 详细

Taro 中父组件传多个值到子组件, 不同页面传值, 子组件修改父组件值

时间:2020-02-25 14:31:43      阅读:573      评论:0      收藏:0      [点我收藏+]

标签:span   fun   context   component   def   success   cti   efault   div   

1.父子组件传值需借助 中间ts文件

hook/context-manager.tsx

// 使用hook给父子组件共享数组

import { createContext } from "@tarojs/taro";

export default createContext({});

  

2.父组件

import TripContext from ‘../../hook/context-manager‘
import Trip_success from ‘../../components/trip_success/index‘

function Home() {
    const [content, setContent] = useState({})
   const [contentType, setContentType] = useState(false)
return (
  <View>{contentType}
    <TripContext.Provider value={{ content, urlName: ‘home‘,setContentType}}>
      <Trip_success /> 
    </TripContext.Provider>
  </View>
)
}

  

3.子组件

import TripContext from ‘../../hook/context-manager‘
import Taro, { useContext, useEffect } from "@tarojs/taro";
function Trip_success() {

  const { content, urlName, setContentType } = useContext(TripContext)

 useEffect(() => {setContentType(true)})
  console.log(‘获取父组件中值‘, content, urlName)
}

  

Taro 中父组件传多个值到子组件, 不同页面传值, 子组件修改父组件值

标签:span   fun   context   component   def   success   cti   efault   div   

原文地址:https://www.cnblogs.com/gqx-html/p/12361476.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!