Javascript React-Redux-将函数从无状态组件移动到容器

新手

我已经将一个地址组件重构为两个。一个是

AddressContainer

，另一个是表示组件地址

地址组件是无状态的，但是我需要在React Select

async上设置一个值。Select

组件是地址组件的一部分，同时通过redux分派更新另一个字段-当它是一个文件的一部分时，它可以工作，但现在不工作

我需要将以下函数移动到容器并引用该值

         const onSuburbChange = (value) => {
          this.setState({ selectedSuburb: value }, () => {
            input.onChange(value)
            updatePostcodeValue(value ? value.postcode : null, sectionPrefix)
          })
        }

由于标记已移动到其自己的文件中，并在容器中引用为：

   <Address handleSuburbSearch={this.handleSuburbSearch}
    addressData={addressData}
    updatePostcodeValue={updatePostcodeValue}
  />

我得到了错误

address.jsx:100未捕获类型错误：无法读取未定义的属性“setState” 在Object.onSuburbChange[作为onChange]（address.jsx:100）

我很清楚地址是无状态的，并且该状态正在/需要在AddressContainer中设置

以下是呈现组件中的React select组件-这些都是它需要的道具：

             <Select.Async
              {...inputProps}
              onChange={onSuburbChange}
              valueKey="id"
              labelKey="suburbName"
              loadOptions={handleSuburbSearch}
              backspaceRemoves={true}
            />

我想在addressContainer中设置

onChange

的值，但我不确定如何重写

onSuburbChange

，因此它会传递值并返回值，同时也会根据另一个函数

updatePostcodeValue

更新邮政编码

---

如何将

onSuburbChange

移动到容器中并在表示组件中引用它？

如果您将

onChange={onSuburbChange}

替换为

onChange={onSuburbChange.bind（this）}

，它应该可以工作。这在javascript中是动态的，取决于调用函数的方式。如果你绑定它，你就不再有这个问题了。他们在这里谈到了这一点：将函数移到了AddressContainer上——在SuburbChangeinAddress和AddressContainer中引用。它给了我一个错误“未捕获引用错误：输入未定义”。如何引用addressContainer中的输入？您是否尝试使用

connect

将分派操作映射到容器@si2030，你能发布你的app.js文件吗？应该在您的组件文件夹中。另外，请尝试onChange={this.onSuburbChange}，而不是onChange={onSuburbChange.bind（this）}，并告诉我您得到了什么。虽然这样做，但它必须引用这样的效果：onSuburbChange（event）{console.log（event.target.value）；this.setState（{term:event.target.value}）；}@si2030，我想说的是，错误非常清楚。我不知道setState的功能是什么。好的，如果组件只有一个对setState的引用，那么应该定义它，但是您忘记了绑定上下文，尤其是在回调中。经验法则，如果您在onChange={this.onSuburbChange}周围传递回调，并且该回调引用了onSuburbChange（event）{this.setState（{term:event.target.value}）；}。您需要像这样绑定上下文：this.onSuburbChange=this.onSuburbChange.bind（this）；