0

我现在正在熟悉 React。我选择 mobx-state-tree 进行状态管理。

由于我在我的 Android 项目中使用了 MVP 模式,因此我会将相同的原则应用于 mobx-state-tree。

我目前是如何实现的,它是有效的。

但是,我想在模型中定义 ScreenView 实现。

有没有办法定义一个不触发render()事件的模型类型?

我想要的结果:

const AuthScreenModel = types
    .model('AuthStore', {
        screen: types.enumeration('Screen', ['auth', 'verification', 'name']),
        screenView: types.norefresh(ScreenViewInterface),
        phoneModel: types.optional(PhoneModel, {})
    })

我目前的解决方法:

const AuthScreenModel = types
    .model('AuthStore', {
        screen: types.enumeration('Screen', ['auth', 'verification', 'name']),
        phoneModel: types.optional(PhoneModel, {})
    })
    .views((self: any) => {
        self.screenView = null
        return {
            getScreenIndex(): number {
                if (self.screen === 'verification')
                    return 1
                if (self.screen === 'name')
                    return 2
                return 0
            }
        }
    })
    .actions((self: any) => {
        return {
            setScreen(screen: string) {
                self.screen = screen
            },
            setScreenIndex(screenIndex: number) {
                self.screenIndex = screenIndex
            },
            setScreenView(screenView: AuthScreenView) {
                self.screenView = screenView
            },
            swipeNext() {
                if (self.screenView) {
                    self.screenView.scrollBy(self.getScreenIndex() < 2 ? 1 : 0)
                }
            },
            swipePrev() {
                if (self.screenView) {
                    self.screenView.scrollBy(self.getScreenIndex() > 0 ? -1 : 0)
                }
            }
        }
    })
const AuthScreenStore = AuthScreenModel.create({
    screen: 'auth',
    phoneModel: PhoneModel.create({
        country: CountryModel.create({}),
        phoneNumber: ''
    })
})
4

1 回答 1

0

使用此方法的反应生命周期,您可以选择是否调用渲染。

例如,您可以使用 shouldComponentUpdate(); 侦听更新,并在您不想呈现新视图时返回 false。

于 2017-11-11T15:11:48.467 回答