Javascript 在使用react路由器重定向后,如何从redux reducer初始化react组件状态

Javascript 在使用react路由器重定向后,如何从redux reducer初始化react组件状态,javascript,reactjs,redux,react-router,web3js,Javascript,Reactjs,Redux,React Router,Web3js,我有一个组件,它有一个html按钮,单击该按钮时应该重定向到react组件,并向redux reducer中的数组分派一个字符串。重定向到使用reactrouter的组件通过调用两个智能协定函数来初始化其状态,该函数使用从重定向到的原始组件发送的字符串。两个智能合约函数调用返回两个对象。需要使用这两个对象设置状态。返回的对象是正确的数据,但页面不会加载。此组件与另一个组件完全相同,只是两个智能合约调用不接受参数,但返回对象中完全相同的数据 import React, { Component, u

我有一个组件,它有一个html按钮,单击该按钮时应该重定向到react组件,并向redux reducer中的数组分派一个字符串。重定向到使用reactrouter的组件通过调用两个智能协定函数来初始化其状态,该函数使用从重定向到的原始组件发送的字符串。两个智能合约函数调用返回两个对象。需要使用这两个对象设置状态。返回的对象是正确的数据,但页面不会加载。此组件与另一个组件完全相同,只是两个智能合约调用不接受参数,但返回对象中完全相同的数据

import React, { Component, useEffect, useState } from "react";
import { connect, useDispatch, useSelector } from "react-redux";
import './index.css'
import MyWeb3 from '../../utils/myWeb3'
import Incidents from '../../contracts/Incidents.json'
import SocialNet from '../../contracts/SocialNet.json';
import {Link, Route, withRouter} from 'react-router-dom'


const Member = () => {
  const [profile, setProfile] = useState({});
  const dispatch = useDispatch();
  const [list, setList] = useState([]);
  const [posts, setPosts] = useState([]);


  useEffect(async () => {
        try {
      const accounts = await MyWeb3.getInstance().getAccounts();
      console.log(accounts)
      const incidents = MyWeb3.getInstance().getContract(Incidents)
      const incidentsInstance = await MyWeb3.getInstance().deployContract(incidents);
      const sn = MyWeb3.getInstance().getContract(SocialNet)    
      const pro = socialNetworkContract.members[0];
      const snInstance = await MyWeb3.getInstance().deployContract(sn);
      const p = await incidentsInstance.usersProfile(pro,{ from: accounts[0] });
          const a = await snInstance.getUsersPosts(pro,{ from: accounts[0] });
          console.log(a)
    console.log(pro, p)

    for (var i = 0; i < a.length; i++) {
          console.log(a[i].words[0]);

      const post = await snInstance.getPost(a[i].words[0])
 //     const pos1 = await GetImage(pos.image)
      setList(oldArray => [...oldArray, post])
      dispatch({ type: 'ADD_POST', response: post })
      console.log('----------- post------------')
      console.log(post)
    }

//      const po = await snInstance.getMyPosts({ from: accounts[0] });
      setProfile(p)
      console.log(profile)
//      console.log(po);
 //     setPosts(po)
 //     const num = await snInstance.getMyPostno({ from: accounts[0] });
//      const list = await getPosts(snInstance, 5);
      console.log(profile, accounts);
    } catch (e) {
      console.error(e)
            }
  }, [])


  const addFriend = async (event) => {
        event.preventDefault();
    try {
      console.log(window.web3.currentProvider)
    } catch (e) {
      console.error(e)
    }
  }

  const postInWall = async (event) => {
        event.preventDefault();
    try {
      console.log(window.web3.currentProvider)
    } catch (e) {
      console.error(e)
    }
  }

    const socialNetworkContract = useSelector((state) => state.socialNetworkContract)

  // const profile = this.state.incidents.profiles(this.props.user)
  return (
    <div>


          <div class="card hovercard">
            <div class="cardheader">
            </div>
            <div class="avatar">
              <img alt="" src="http://lorempixel.com/100/100/people/9/" />
            </div>
                          <div class="title">
                <a target="_blank">Name : {profile.name}</a>
              </div>
              <div class="desc">Location : {profile.location}</div>
              <div class="desc">Description : {profile.description}</div>

                  <button variant="primary" onClick={addFriend}>Add Friend</button>
                  <button variant="primary" onClick={postInWall}>Post in wall</button>

            <div class="bottom">
              <a class="btn btn-primary btn-twitter btn-sm" href="https://twitter.com/webmaniac">
                <i class="fa fa-twitter"></i>
              </a>
              <a class="btn btn-danger btn-sm" rel="publisher"
                href="https://plus.google.com/+ahmshahnuralam">
                <i class="fa fa-google-plus"></i>
              </a>
              <a class="btn btn-primary btn-sm" rel="publisher"
                href="https://plus.google.com/shahnuralam">
                <i class="fa fa-facebook"></i>
              </a>
              <a class="btn btn-warning btn-sm" rel="publisher" href="https://plus.google.com/shahnuralam">
                <i class="fa fa-behance"></i>
              </a>
            </div>

        {socialNetworkContract.posts.map((p, index) => {
          return <tr key={index}>
{p.message}
{p.replies}


        </tr>})}


          </div>
          </div>

  )
}

export default withRouter(Member);
My routes.js

const Routes = (props) => {
  return (
      <Switch>

      <Route path="/member" exact component={Member} /> 
        <Route path="/profile" exact component={Profile} />

      </Switch>
    
  )
}

export default Routes
const Routes=(道具)=>{
返回(
)
}
导出默认路由
html按钮和在原始组件上调用的函数是

const getProfile = async (member) => {
    const addr = dispatch({ type: 'ADD_MEMBER', response: member })
    console.log(member)
    history.push('/member')
}


    <button onClick={() => getProfile(p.publisher)}>Profile</button> 
const getProfile=async(成员)=>{
const addr=dispatch({type:'ADD_MEMBER',response:MEMBER})
console.log(成员)
history.push(“/member”)
}
getProfile(p.publisher)}>Profile
const getProfile = async (member) => {
    const addr = dispatch({ type: 'ADD_MEMBER', response: member })
    console.log(member)
    history.push('/member')
}


    <button onClick={() => getProfile(p.publisher)}>Profile</button>