Skip to content
This repository has been archived by the owner on Dec 31, 2020. It is now read-only.

Clarify the reason why there is the restriction on changing the set of stores #760

Merged
merged 2 commits into from
Aug 12, 2019
Merged

Clarify the reason why there is the restriction on changing the set of stores #760

merged 2 commits into from
Aug 12, 2019

Conversation

vkrol
Copy link
Contributor

@vkrol vkrol commented Aug 12, 2019

README.md Outdated Show resolved Hide resolved
Co-Authored-By: Daniel K. <[email protected]>
@danielkcz danielkcz merged commit 34ab6ef into mobxjs:master Aug 12, 2019
@danielkcz
Copy link
Contributor

Thanks

@vkrol vkrol deleted the clarify-restriction-on-changing-stores-set branch August 12, 2019 20:07
@nebosite
Copy link

nebosite commented Jul 1, 2020

@FredyC , since the thread here is locked, I'll post my comment here:

I ran into the "provided stores has changed" exception today trying to do what felt pretty innocent based on my data-binding experience with XAML apps. Basically, I'm showing a set of controls based on an array of models. The onClick of the refresh button tries to swap out one of the models in the client array for a new model. This is where the exception happens.

Here is the UI code:

    render() {
        const {gameTestModel} = this.props;
        if(gameTestModel.presenterSize === 0) this.updatePresenterSize(window.innerWidth);
        
        const renderClient = (clientNumber: number) => {
            const clientModel = gameTestModel.clientModels[clientNumber];

            return (
                <React.Fragment>
                    <button onClick={()=>gameTestModel.refreshClientModel(clientNumber)}>Refresh</button>
                    <LobbyMainPage lobbyModel={clientModel} /> 
                </React.Fragment>)
        }

        return (
            <div className="gameTestComponent">
                <table>
                    <tbody>
                        <tr>
                            { [0,1,2,3].map(n => <td key={n}>{renderClient(n)}</td> )}
                        </tr>
                    </tbody>
                </table>
            </div>
        );
    }

Here is the relevant model code:


export class GameTestModel  {
    clientModels = observable(new Array<ILobbyModel>())

    constructor(numberOfClients: number)
    {
        for(let i = 0; i < numberOfClients; i++)  {
            this.clientModels.push(this.makeClientModel(`client${i}`))
        }
    }

    private makeClientModel(clientName: string)
    {
        const newLobby = new LobbyModel();
        newLobby.playerName = clientName;
        return newLobby;
    }
}

@danielkcz
Copy link
Contributor

Sorry, but PR is not a place for discussing your problem. Open a new issue with reproduction, thanks.

@mobxjs mobxjs locked as resolved and limited conversation to collaborators Jul 1, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants