C
C
chelkaz2018-11-02 13:58:55
React
chelkaz, 2018-11-02 13:58:55

How to pass data received from Ajax to another React component?

Good afternoon friends.
I have two components, one filter. Another list of products (it is empty by default)
In the filter component, when a section is selected, Axios Returns the products of this section, I get them from, everything is ok.
But how can I pass now to another component to parse? After all, I can process the section selection event only in the filter, and this is another component.
On the page, these components are in different places.
Filter example:

import React, { Component } from 'react';
// Тут еще всякие константы и функции
class SearchTree extends React.Component {
    GetCount = (checkedKeys) => {
        axios
            .post('/url', {products: checkedKeys})
            .then(function (response) {
               //вот товары пришли Как мне их передать в другой компонент?
                console.log(response.data)
             
            })
    }

    onCheck = (checkedKeys, info) => {
    //получаем товары раздела
        this.GetCount(checkedKeys)
    }

    render() {       
        return (
            <div>
                // тут список разделов формируется и onCheck на них
            </div>
        );
    }
}
//тут ReactDOM.render

And here is another component where you need to display the goods received above
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
class AjaxProductList extends React.Component {
    render() {
        return (
            // тут типа UL LI нужно получить товар и вывести списком
        );
    }
}
//тут ReactDOM.render

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Anton Spirin, 2018-11-02
@chelkaz

Your filter should only toggle some state via a callback or redux action. It should not know anything about the existence of any data or API.
Solutions:
1. Lifting state up
2. Redux or equivalents.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question