独特的listKey prop问题

时间:2018-06-11 12:43:40

标签: reactjs react-native native-base

我正在尝试在我的应用中制作嵌套的平面列表。

我使用原生基础的手风琴组件作为我的平板列表的父级,并且在每个部分的内容中,我试图放置一个平面列表。但是,我最终得到的错误是“你必须将唯一的listKey道具传递给每个兄弟列表”

componentWillMount() {
    var toPush = []
    const request = axios({
        method: "POST",
        url: "XXX",
        data: {
            customer_id: this.props.User.userData.id
        },
        headers: {
            "Content-Type": "application/json"
        }
    }).then(response => {
        response.data.map(history => {

            this.getDish(history.order_id).then((dish)=>{
                this.setState({
                    dataArray: [...this.state.dataArray,
                        {
                            title: "Restaurant:" + history.restaurant_name + " , " + "Order id : " + history.order_id,
                            content: <Item data={dish} listKey={history.order_id}/>
                        }
                    ]
                })               
            })

        })
        this.setState({
            dataArray: toPush
        })

如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

您需要为组件添加键属性。使用密钥以便反应可以识别哪些项目已被更改。

content: <Item data={dish} key={history.order_id} listKey={history.order_id} />

如果您不需要listKey道具,可以将其删除