bugfix> javascript > 投稿
//import routes from "./routes";
import { Link, withRouter, NavLink, useHistory } from "react-router-dom";
export default function App() {
  console.log(this.props.data.data);
  const [value1, setValue1] = useState(0);
  const [value2, setValue2] = useState(0);
...}

下記の最後のページから渡されたデータ変数にアクセスするslider.jsのコードのこの部分
       axios
        .post(
          "/get_spec_other",
          {
            selected_country: this.props.selectedCountry,
            selected_disease: this.props.selectedDisease,
            selected_drug: this.props.selectedDrugs,
          },
          { headers: { "content-type": "application/json" } }
        )
        .then((res) => {
          const SpecificationName = Array.from(res.data);
          console.log(res.data);
          this.props.history.push({pathname: '/slider', data: res.data});
          alert(res.data);

ここでデータを/ sliderに渡し、slider.jsを開きます。
回答 2 件
  • 問題は、機能コンポーネントを使用していて、「これ」が存在することを期待していることです。 これはそれがどのように見えるべきかです:(アプリの関数引数で宣言された小道具に注意してください)

    //import routes from "./routes";
    import { Link, withRouter, NavLink, useHistory } from "react-router-dom";
    export default function App(props) {
      console.log(props.data.data);
      const [value1, setValue1] = useState(0);
      const [value2, setValue2] = useState(0);
    ...}
    
    

    あなたがする必要があるもう一つのことはあなたがデータを得るために適切なフックを使用していることを確認することです: https://css-tricks.com/the-hooks-of-react-router/

  • ありがとうございました!親から子のコンポーネントにデータを渡していないので、どこが間違っているのかがわかりました

    render() {     
    const { data } = this.props.location     
    console.log(data); ...
    }
    
    

    return ( 
    ....  
    <App data={data}/> 
    ...
    }
    
    

    export default function App(data) {   
    //const { data } = props.location   
    console.log(data); 
    ......
    }
    
    

あなたの答え