是否有一种方法来获得一个mobx可观察变量地址在ReactJS

Question

我试图改变一个变量值给定的组件通过props内部的函数在这个组件。我无法改变可观察对象的值(即使通过参数传递变量)，所以我想知道我是否可以检索可观察对象的地址，以这种方式直接修改它。

@observer
class Exemple extends React.Component {
@observable Nom
@action onChangeNom = newValue => {
this.Nom = newValue //I want to have something similar to this function inside the component but it would take the value to update and the newValue as parameters
}
render() {
return (
<FormComponent //this is where I call my component
ContainerStyle={{
display: 'flex',
flexDirection: 'row',
flexWrap: 'wrap',
}}
ObjArray={[
{
InputDivStyle: { width: '49%', marginRight: '2%' },
FieldType: 'textInput',
FieldStyle: { borderColor: this.missingLastName ? 'red' : COLOR_NOT_BLACK },
OnChange: this.onChangeNom,
Placeholders: 'Ex. Durand',
Value: this.Nom, //this is the value I want to change inside the component
InputTitle: 'Nom',
},
]}
/>
)
}
}
@observer
class FormComponent extends React.Component<props> {
render() {
const { ObjArray, ContainerStyle } = this.props
return (
<div style={ContainerStyle}>
{ObjArray.map((e, index: number) => {
const { Disabled, FieldStyle, InputDivStyle, FieldType, Placeholders, OnChange, Value, InputTitle } = e
return (
<>
<div style={InputDivStyle ?? {}} key={index + 'Input'}>
{InputTitle && (
<>
<Label medium>{InputTitle}</Label>
</>
)}
<GenericInput
disabled={Disabled ?? false}
placeholder={Placeholders ?? ''}
style={FieldStyle ?? {}}
type={FieldType ?? ''}
value={Value ?? ''}
onChange={evt => {
OnChange(evt.target.value)
}}
/>
</div>
</>
)
})}
</div>
)
}
}
export default FormComponent

我担心的是，我希望能够改变组件内部的值，而不必为每个值创建一个函数(如果ObjArray中有多个对象，例如)。(我已经尝试通过传递值作为组件内部的参数，但它不会在外部更新它，这就是为什么我希望能够直接在存储它的内存地址更改值(就像你可以在C中使用指针一样))。

Answer 1

我希望能够直接在存储它的内存地址处更改值

在Javascript中是不可能的，你不能"pass-by-reference"(原意)所以你不能改变这样的值

最简单的方法是有这样的函数:

@action onChange = (key, newValue) => {
this[key] = newValue 
}

你用一个键传递给组件，然后像这样调用:

onChange={evt => {
// Or you can use InputTitle instead of key
OnChange(key, evt.target.value)
}}

这样你就不需要为每个

值创建很多函数