Question

我想从子组件更改数组中对象的值，该数组在我的状态之内，在我的父项之内。问题是我需要event.target.value和item.id（这是一个uuid），这样我才能知道要更改的对象。但是，经过所有尝试，我只能传递一个值，即输入值或item.id。任何帮助表示赞赏。

这是我的输入组件：

<Input onChange={this.props.updateQuantity} defaultValue={item.unit_quantity || ""}/>

这是updateQuantity：


    updateQuantity = (e,id) => {
        var copy = [...this.state.items]
        for(let i = 0; i<copy.length; i++){
            if(copy[i].id == id){
                copy[i].unit_quantity = e.target.value;
                break;
            }
        }
        this.setState({
            items: copy
        })

    }

Answer 1

您可以使用ES6箭头功能并传递其他arg。（事件）。

<Input onChange={(event)=>this.props.updateQuantity(event,item.id)} defaultValue={item.unit_quantity || ""}/>

并在父组件中按原样使用：

updateQuantity = (event,id) => {
    console.log(event, id)
    // Rest of the code...
}

Answer 2

呈现输入的子级可能具有一个中间函数，该函数可使用正确的参数从props调用<?xml version="1.0" encoding="utf-8"?> <layout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <data> <variable name="viewModel" type="net.gahfy.mvvmposts.ui.post.PostListViewModel" /> </data> <android.support.constraint.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent"> <ProgressBar android:layout_width="wrap_content" android:layout_height="wrap_content" app:mutableVisibility="@{viewModel.getLoadingVisibility()}" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintEnd_toEndOf="parent" /> </android.support.constraint.ConstraintLayout> </layout>函数。

因此，您将传递给输入onChange的函数更改为子项中的本地函数：

updateQuantity

然后您在子级中创建函数，如下所示：

<Input onChange={this.updateQuantity} defaultValue={item.unit_quantity || ""}/>

这将使用所需的任何参数来调用parent函数。我假设您的孩子的ID存储在道具中，但是您可以将其更改为存储在任何地方。

如何从子组件的父组件中的数组内部设置对象的状态？

2 个答案: