Question

我有这个问题，我可以找到答案，但不能解决我的问题。

错误提示我'TypeError: Cannot read property 'changeUsername' of undefined'。

代码如下：

import {observer, inject} from 'mobx-react';

@inject(['loginStore'])  
@observer
class login extends Component {


    changeUsername = (e) => {
        debugger;
        this.props.loginStore.changeUsername(e.target.value)
    }

    changePassword = (e) => {
        debugger;
        this.props.loginStore.changePassword(e.target.value)
    }



}

Answer 1

您需要确保已在应用程序中注册了商店实例。这是通过<DataGrid ItemsSource="{Binding Data}" VirtualizingPanel.ScrollUnit="Pixel"> ... </DataGrid>组件完成的（请参见下面的示例）。

Provider确保登录存储可以被应用程序中的嵌套组件（在您的情况下为登录组件）访问。需要注意的一些关键概念是：

必须定义商店对象
必须通过<Provider>注册商店实例（请参见下面的示例）
然后可以通过组件访问商店
<Provider/>可用于选择特定商店并将其注入到组件中（例如，在复杂的应用程序中定义了许多商店的情况下）

此代码示例有望为您传达这些概念：

@inject

Answer 2

@Dacre丹尼您好，我不知道如何回复，所以我@您。

我一直使用您所说的方式，id路由器代码使用''跟进：

import * as stores from '../stores';

export default class Container extends BasePage{

    render(){
        
        return(
            <Provider { ...stores}>
                <Router>
                        <Switch>
                            <Route path="/login" component={login}/>
                            <Route path="/reg" component={reg}/>
                            <Route path="/404" component={NotFound}/>
                            <Route path="/main" component={mainindex}/>
                            <Route path="/react" component={App}/>
                            <Route component={adminmain}/>
                        </Switch>
                </Router>
            </Provider>
        )
    
    }
}

Answer 3

您插入的商店名称在一个数组中。应该只是一个论点

@inject('loginStore')

“ loginStore”将是存储文件中导出内容的任意位置。

mobX + React无法注入

3 个答案: