我现在正在熟悉 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: ''
})
})