javascript - 使用变量访问 Prop

Question

我正在尝试使用变量名来访问 props 中的状态数据。以下是我迄今为止尝试过但没有奏效的方法。

我想在 Prop 中访问以下项目:

function mapStateToProps(state) {
    return {
        redCar: state.cars.redCar,
        blueCar: state.cars.blueCar
    }
}

红色和蓝色汽车都是看起来像这样的物体:

{
   id: "red-car",
   year: 2017,
   make: "Infiniti",
   model: "QX 80"
}
{
   id: "blue-car",
   year: 2018,
   make: "RAM",
   model: "1500"
}

我正在尝试使用以下不起作用的变量访问制造商和模型。我得到“未定义”:

handleChange(car, propertyName, value) {

   const currentValue = this.props[car][propertyName];
}

如何使用变量名访问我的 Prop ？

Answer 1

function mapStateToProps(state) {
    return {
        redCar: state.cars.redCar,
        blueCar: state.cars.blueCar
    }
}

在此函数中，您指定您将在名为 redCar 和 blueCar 的 Prop 上设置键。

handleChange(car, propertyName, value) {

   const currentValue = this.props["car"]["propertyName"];
}

此处您正试图使用​​方括号表示法来访问该属性。括号符号仅在传递给括号的字符串与键的名称拼写完全相同时才有效，而在您的情况下则不是。该属性可以是 redCar 或 blueCar，但它不是 "car"。

假设传递给 handleChange 函数的 car 参数可能具有 redCar 或 blueCar 的值> 你可以像这样重写你的代码，

handleChange(car, propertyName, value) {

   const currentValue = this.props[car][propertyName];
}

Bracket notation