Невозможно передать реквизиты дочернему компоненту - PullRequest
0 голосов
/ 26 июня 2019

У меня есть компонент, который извлекает данные при монтировании и передает их своему дочернему компоненту, в котором есть таблица для итерации этих данных. В моем родительском компоненте:

state={
    dataSales: [],
}


componentDidMount(){


        var headers = {
            'Content-Type': 'application/x-www-form-urlencoded',
            'Access-Control-Allow-Headers': 'x-access-token',
            'x-access-token': this.state.id
        }

        axios.post('http://b******************OEMLevel2', {
            oem:'all'
        }, 
        {headers: headers})
        .then((res) => {

            let sample = res.data.data[0]

              this.setState({

                dataSales: sample
            })

        })
        .catch(err => {
            console.log(err)
        });

    }

   render() {
    console.log(this.state.dataSales)
    return (
        <View>


                {this.state.dataSales ? <Table oeminfo={this.state.dataSales}/> : null}


        </View>
    )
}

формат полученных данных:

enter image description here

В моем дочернем компоненте:

export default class Table extends Component {
    constructor(props) {
        super(props)
    }

    componentDidMount(){
        console.log(this.props)
    }

    render() {
        return (
            <View style={{flexDirection:'row', justifyContent:'space-around'}}>

                    <View><Text>Group</Text></View>
                    <View><Text>Total Sales</Text></View>
                    <View><Text>Percentage Sales</Text></View>
            </View>
        )
    }
}

Консоль в дочернем компоненте выдает пустой массив как: {oeminfo: Array(0)}

Пожалуйста, помогите исправить проблему.

1 Ответ

0 голосов
/ 26 июня 2019

Возможно ли, что вы инициализируете this.state.dataSales пустой строкой ""?

Проблема может заключаться в том, что условие this.state.dataSales? True: false возвращает true, и при получении новых реквизитов дочерний компонент не обновляется

...