关于语句this.props.onChange({[this.state.searchField]: ...})的解析与赋值疑问

先直接拆解代码核心逻辑，再解答你的第二个问题：

一、语句的完整含义 #

这条代码是React组件里常见的向父组件传递状态更新的逻辑，拆解开来看：

1. 计算属性名生成对象：{[this.state.searchField]: ...} 是ES6的计算属性语法——它不是用固定字面量作为对象的键，而是用this.state.searchField的当前值作为键名。举个例子，如果this.state.searchField的值是"locationValid"，那这个对象就会变成{locationValid: true/false}。
2. 布尔值判断逻辑：右边的item.formatted_address.includes(item.name)是字符串检查逻辑：判断item的完整地址（formatted_address）里是否包含item的名称（name），最终返回true或false的布尔值。
3. 触发父组件回调：最后把这个键值对对象作为参数传给this.props.onChange——这是父组件传递过来的回调函数，目的是把“地址是否包含名称”的判断结果，以searchField指定的键名形式通知给父组件，让父组件处理对应的状态更新。

二、是否会给this.state.searchField的每一个元素赋值？ #

完全不会，甚至和“修改this.state.searchField”没有任何关系，原因有两个：

1. 这条语句只是读取this.state.searchField的值用来生成对象键，没有任何赋值操作（没有=符号去修改它）；
2. 就算this.state.searchField是一个数组，计算属性语法也只会把整个数组转成字符串作为单个键（比如数组["fieldA", "fieldB"]会变成"fieldA,fieldB"作为键），不会遍历数组的每个元素生成多个键值对。

如果你想给数组里的每个元素都生成对应键值对 #

如果你的需求是：this.state.searchField是一个数组，要给数组里的每个键都赋值为“地址是否包含名称”的结果，那需要用遍历的方式构建对象，比如用reduce：

// 遍历searchField数组，生成每个键对应的布尔值
const updateData = this.state.searchField.reduce((result, key) => {
  result[key] = item.formatted_address.includes(item.name);
  return result;
}, {});
// 把完整的对象传给父组件
this.props.onChange(updateData);

内容的提问来源于stack exchange，提问作者Leo M