如何将多个 mobx 观察器状态作为参数传递到函数中

Question

我有这些状态：

@observable questionString: string = '';
@observable questionLengthRemaining: number = 25;
@observable descriptionString: string = '';
@observable descriptionLengthRemaining: number = 500;

我有这个功能：

onInputChamge = (state: any, stateLengthRemaining: any, maxLength: any, text: string) => {
state = text;
stateLengthRemaining = maxLength - text.length;
}

这是我的组件：

<TextInput
multiline={true}
maxLength={questionMaxLength}
placeholder='Type your question here'
style={styles.questionInput}
onChangeText={(question) => this.onInputChamge(this.questionString, this.questionLengthRemaining, questionMaxLength, question)}
/>

我有多个textInput，只需要做同样的事情并接受onInputChange函数，但状态和长度不同。出于某种原因，将状态作为函数中的参数传递是行不通的，但是当我为每个状态创建不同的函数时，例如：

onQuestionChange = (text: string) => {
this.questionString = text;
this.questionLengthRemaining = maxQuestionLength - text.length;
}

它有效。

为每个输入创建相同的函数是没有意义的，因为这是函数应该限制的。顺便说一下，我正在使用打字稿和 mobx。有什么办法可以做到这一点吗？(如果我控制台记录剩余的长度，它会打印出正确的数字和字符串，所以不知道发生了什么(

Answer 1

如果你在同一个类组件中有所有observable，那么你可以做这样的事情：

onInputChange = (key, value, stateLengthRemaining, maxLength, text) => {
this[key] = value
}

然后传递属性的名称，如该question => this.onInputChange('questionString', question, ... )

您也不需要手动分配descriptionLengthRemaining因为您可以将其设置为计算属性 https://mobx.js.org/refguide/computed-decorator.html

@computed get questionLengthRemaining() {
return 25 - this.questionString.length
};