优化tab bar显示方式 review by 阿瑟
Showing
14 changed files
with
70 additions
and
40 deletions
@@ -176,6 +176,7 @@ export default function community(platform) { | @@ -176,6 +176,7 @@ export default function community(platform) { | ||
176 | getSceneStyle={(props) => { | 176 | getSceneStyle={(props) => { |
177 | return this.navPushStyle(props); | 177 | return this.navPushStyle(props); |
178 | }} | 178 | }} |
179 | + onBack={this.onBack} | ||
179 | /> | 180 | /> |
180 | 181 | ||
181 | <Scene | 182 | <Scene |
@@ -199,6 +200,7 @@ export default function community(platform) { | @@ -199,6 +200,7 @@ export default function community(platform) { | ||
199 | return store.getState().posting.inPosting; | 200 | return store.getState().posting.inPosting; |
200 | } | 201 | } |
201 | } | 202 | } |
203 | + onBack={this.onBack} | ||
202 | /> | 204 | /> |
203 | 205 | ||
204 | <Scene | 206 | <Scene |
@@ -218,6 +220,7 @@ export default function community(platform) { | @@ -218,6 +220,7 @@ export default function community(platform) { | ||
218 | hideNavBar={false} | 220 | hideNavBar={false} |
219 | component={MessageCenterContainer} | 221 | component={MessageCenterContainer} |
220 | initial={false} | 222 | initial={false} |
223 | + onBack={this.onBack} | ||
221 | /> | 224 | /> |
222 | 225 | ||
223 | <Scene | 226 | <Scene |
@@ -226,6 +229,7 @@ export default function community(platform) { | @@ -226,6 +229,7 @@ export default function community(platform) { | ||
226 | hideNavBar={false} | 229 | hideNavBar={false} |
227 | component={LikeMessageContainer} | 230 | component={LikeMessageContainer} |
228 | initial={false} | 231 | initial={false} |
232 | + onBack={this.onBack} | ||
229 | /> | 233 | /> |
230 | 234 | ||
231 | <Scene | 235 | <Scene |
@@ -237,6 +241,7 @@ export default function community(platform) { | @@ -237,6 +241,7 @@ export default function community(platform) { | ||
237 | rightTitle='确认' | 241 | rightTitle='确认' |
238 | onRight={this.settingOnRight} | 242 | onRight={this.settingOnRight} |
239 | rightButtonTextStyle={{color: 'white'}} | 243 | rightButtonTextStyle={{color: 'white'}} |
244 | + onBack={this.onBack} | ||
240 | /> | 245 | /> |
241 | 246 | ||
242 | <Scene | 247 | <Scene |
@@ -258,6 +263,7 @@ export default function community(platform) { | @@ -258,6 +263,7 @@ export default function community(platform) { | ||
258 | hideNavBar={false} | 263 | hideNavBar={false} |
259 | component={SubjectPostContainer} | 264 | component={SubjectPostContainer} |
260 | initial={false} | 265 | initial={false} |
266 | + onBack={this.onBack} | ||
261 | /> | 267 | /> |
262 | 268 | ||
263 | <Scene | 269 | <Scene |
@@ -286,10 +292,10 @@ export default function community(platform) { | @@ -286,10 +292,10 @@ export default function community(platform) { | ||
286 | } | 292 | } |
287 | }} | 293 | }} |
288 | rightButtonTextStyle={[styles.barRightButtonText,{color:store.getState().posting.dataValid?'white':'#a0a0a0'}]} | 294 | rightButtonTextStyle={[styles.barRightButtonText,{color:store.getState().posting.dataValid?'white':'#a0a0a0'}]} |
289 | - onBack={()=>{ | 295 | + onBack={(navigationState) => { |
290 | let dismissKeyboard = require('dismissKeyboard'); | 296 | let dismissKeyboard = require('dismissKeyboard'); |
291 | dismissKeyboard(); | 297 | dismissKeyboard(); |
292 | - Actions.pop(); | 298 | + this.onBack(navigationState); |
293 | }} | 299 | }} |
294 | /> | 300 | /> |
295 | 301 | ||
@@ -302,8 +308,6 @@ export default function community(platform) { | @@ -302,8 +308,6 @@ export default function community(platform) { | ||
302 | renderHomeTitle(navProps) { | 308 | renderHomeTitle(navProps) { |
303 | let {width, height} = Dimensions.get('window'); | 309 | let {width, height} = Dimensions.get('window'); |
304 | 310 | ||
305 | - | ||
306 | - | ||
307 | return ( | 311 | return ( |
308 | <Animated.View style={[styles.title,]}> | 312 | <Animated.View style={[styles.title,]}> |
309 | <TouchableOpacity onPress={() => { | 313 | <TouchableOpacity onPress={() => { |
@@ -345,7 +349,6 @@ export default function community(platform) { | @@ -345,7 +349,6 @@ export default function community(platform) { | ||
345 | /> | 349 | /> |
346 | </TouchableOpacity> | 350 | </TouchableOpacity> |
347 | 351 | ||
348 | - | ||
349 | <View style={{ | 352 | <View style={{ |
350 | backgroundColor: 'white', | 353 | backgroundColor: 'white', |
351 | position: 'absolute', | 354 | position: 'absolute', |
@@ -358,6 +361,15 @@ export default function community(platform) { | @@ -358,6 +361,15 @@ export default function community(platform) { | ||
358 | ); | 361 | ); |
359 | }, | 362 | }, |
360 | 363 | ||
364 | + onBack(navigationState) { | ||
365 | + Actions.pop(); | ||
366 | + let children = navigationState.children; | ||
367 | + let home = children[0]; | ||
368 | + if (children.length == 2 && home.sceneKey == 'Home') { | ||
369 | + ReactNative.NativeModules.YH_CommunityHelper.showTabBar(); | ||
370 | + } | ||
371 | + }, | ||
372 | + | ||
361 | homeOnRight(state) { | 373 | homeOnRight(state) { |
362 | state.dispatch(startEditPost(state.getPostingState())); | 374 | state.dispatch(startEditPost(state.getPostingState())); |
363 | }, | 375 | }, |
@@ -223,7 +223,7 @@ class NavBar extends React.Component { | @@ -223,7 +223,7 @@ class NavBar extends React.Component { | ||
223 | } | 223 | } |
224 | let buttonImage = childState.backButtonImage || | 224 | let buttonImage = childState.backButtonImage || |
225 | state.backButtonImage || this.props.backButtonImage; | 225 | state.backButtonImage || this.props.backButtonImage; |
226 | - let onPress = childState.onBack || Actions.pop; | 226 | + let onPress = (childState.onBack && childState.onBack.bind(null, state)) || Actions.pop; |
227 | 227 | ||
228 | if (state.index === 0) { | 228 | if (state.index === 0) { |
229 | return null; | 229 | return null; |
@@ -378,7 +378,8 @@ export default class User extends React.Component { | @@ -378,7 +378,8 @@ export default class User extends React.Component { | ||
378 | hasRightButton={true} | 378 | hasRightButton={true} |
379 | msgCount={this.props.profile.msgCount} | 379 | msgCount={this.props.profile.msgCount} |
380 | rightButtonClick={this.props.rightButtonClick} | 380 | rightButtonClick={this.props.rightButtonClick} |
381 | - /> | 381 | + onBack={this.props.onBack} |
382 | + /> | ||
382 | 383 | ||
383 | </View> | 384 | </View> |
384 | ); | 385 | ); |
@@ -141,7 +141,7 @@ class UserNavBar extends React.Component { | @@ -141,7 +141,7 @@ class UserNavBar extends React.Component { | ||
141 | } | 141 | } |
142 | 142 | ||
143 | renderBackButton() { | 143 | renderBackButton() { |
144 | - let onPress = Actions.pop; | 144 | + let onPress = this.props.onBack || Actions.pop; |
145 | return ( | 145 | return ( |
146 | <TouchableOpacity | 146 | <TouchableOpacity |
147 | style={styles.backButton} | 147 | style={styles.backButton} |
@@ -180,7 +180,11 @@ export default class UserThatNotMe extends React.Component { | @@ -180,7 +180,11 @@ export default class UserThatNotMe extends React.Component { | ||
180 | }} | 180 | }} |
181 | /> | 181 | /> |
182 | 182 | ||
183 | - <UserNavBar scrollValue={this.state.scrollValue} channel={this.props.channel}/> | 183 | + <UserNavBar |
184 | + scrollValue={this.state.scrollValue} | ||
185 | + channel={this.props.channel} | ||
186 | + onBack={this.props.onBack} | ||
187 | + /> | ||
184 | 188 | ||
185 | </View> | 189 | </View> |
186 | ) | 190 | ) |
@@ -124,13 +124,6 @@ class HomeContainer extends React.Component { | @@ -124,13 +124,6 @@ class HomeContainer extends React.Component { | ||
124 | }); | 124 | }); |
125 | } | 125 | } |
126 | 126 | ||
127 | - componentWillReceiveProps(nextProps) { | ||
128 | - if (nextProps.showNativeTabBar) { | ||
129 | - ReactNative.NativeModules.YH_CommunityHelper.showTabBar(); | ||
130 | - Actions.refresh({key: 'Home', showNativeTabBar: false}); | ||
131 | - } | ||
132 | - } | ||
133 | - | ||
134 | componentWillUnmount() { | 127 | componentWillUnmount() { |
135 | if (parseInt(this.props.app.container) === 1) { | 128 | if (parseInt(this.props.app.container) === 1) { |
136 | this.subscription && this.subscription.remove(); | 129 | this.subscription && this.subscription.remove(); |
@@ -63,9 +63,7 @@ class LikeMessageContainer extends React.Component { | @@ -63,9 +63,7 @@ class LikeMessageContainer extends React.Component { | ||
63 | } | 63 | } |
64 | 64 | ||
65 | componentWillUnmount() { | 65 | componentWillUnmount() { |
66 | - if (shouldShowTabBar(this.props.navigationState)) { | ||
67 | - Actions.refresh({key: 'Home', showNativeTabBar: true}); | ||
68 | - } | 66 | + |
69 | } | 67 | } |
70 | 68 | ||
71 | _onPressPost(id) { | 69 | _onPressPost(id) { |
@@ -84,9 +84,7 @@ class PostingContainer extends Component{ | @@ -84,9 +84,7 @@ class PostingContainer extends Component{ | ||
84 | } | 84 | } |
85 | 85 | ||
86 | componentWillUnmount() { | 86 | componentWillUnmount() { |
87 | - if (shouldShowTabBar(this.props.navigationState)) { | ||
88 | - Actions.refresh({key: 'Home', showNativeTabBar: true}); | ||
89 | - } | 87 | + |
90 | } | 88 | } |
91 | 89 | ||
92 | componentWillReceiveProps(nextProps) { | 90 | componentWillReceiveProps(nextProps) { |
@@ -92,10 +92,6 @@ class SectionContainer extends React.Component { | @@ -92,10 +92,6 @@ class SectionContainer extends React.Component { | ||
92 | } | 92 | } |
93 | 93 | ||
94 | componentWillUnmount() { | 94 | componentWillUnmount() { |
95 | - if (shouldShowTabBar(this.props.navigationState)) { | ||
96 | - Actions.refresh({key: 'Home', showNativeTabBar: true}); | ||
97 | - } | ||
98 | - | ||
99 | this.props.actions.sectionClean(this.sid); | 95 | this.props.actions.sectionClean(this.sid); |
100 | } | 96 | } |
101 | 97 |
@@ -78,6 +78,7 @@ class UserContainer extends React.Component { | @@ -78,6 +78,7 @@ class UserContainer extends React.Component { | ||
78 | this._onEndReached = this._onEndReached.bind(this); | 78 | this._onEndReached = this._onEndReached.bind(this); |
79 | this._rightButtonClick = this._rightButtonClick.bind(this); | 79 | this._rightButtonClick = this._rightButtonClick.bind(this); |
80 | this._onPressSectionTag = this._onPressSectionTag.bind(this); | 80 | this._onPressSectionTag = this._onPressSectionTag.bind(this); |
81 | + this._onBack = this._onBack.bind(this); | ||
81 | } | 82 | } |
82 | 83 | ||
83 | componentDidMount() { | 84 | componentDidMount() { |
@@ -100,14 +101,16 @@ class UserContainer extends React.Component { | @@ -100,14 +101,16 @@ class UserContainer extends React.Component { | ||
100 | } | 101 | } |
101 | 102 | ||
102 | componentWillUnmount() { | 103 | componentWillUnmount() { |
103 | - if (shouldShowTabBar(this.props.navigationState)) { | ||
104 | - Actions.refresh({key: 'Home', showNativeTabBar: true}); | ||
105 | - } | ||
106 | - | ||
107 | this.props.actions.userClean(); | 104 | this.props.actions.userClean(); |
108 | - this.observer.remove(); | 105 | + this.observer && this.observer.remove(); |
109 | } | 106 | } |
110 | 107 | ||
108 | + _onBack() { | ||
109 | + Actions.pop(); | ||
110 | + if (shouldShowTabBar(this.props.navigationState)) { | ||
111 | + ReactNative.NativeModules.YH_CommunityHelper.showTabBar(); | ||
112 | + } | ||
113 | + } | ||
111 | 114 | ||
112 | // private method | 115 | // private method |
113 | _onPressAvatar(url) { | 116 | _onPressAvatar(url) { |
@@ -204,8 +207,6 @@ class UserContainer extends React.Component { | @@ -204,8 +207,6 @@ class UserContainer extends React.Component { | ||
204 | }); | 207 | }); |
205 | } | 208 | } |
206 | 209 | ||
207 | - | ||
208 | - | ||
209 | _onRefresh() { | 210 | _onRefresh() { |
210 | InteractionManager.runAfterInteractions(() => { | 211 | InteractionManager.runAfterInteractions(() => { |
211 | this.props.actions.posts(true); | 212 | this.props.actions.posts(true); |
@@ -235,8 +236,9 @@ class UserContainer extends React.Component { | @@ -235,8 +236,9 @@ class UserContainer extends React.Component { | ||
235 | console.log('message clicked-----------'); | 236 | console.log('message clicked-----------'); |
236 | this.props.actions.goToMessageCenter(); | 237 | this.props.actions.goToMessageCenter(); |
237 | } | 238 | } |
238 | - render() { | ||
239 | 239 | ||
240 | + render() { | ||
241 | + console.log(this.props); | ||
240 | let {profile, activeTab, isFetching, ptr, posts: postsData, like: likeData, reply: replyData} = this.props.user; | 242 | let {profile, activeTab, isFetching, ptr, posts: postsData, like: likeData, reply: replyData} = this.props.user; |
241 | let listData = Immutable.fromJS([{posts: postsData.list, like: likeData.list, reply: replyData.list}]); | 243 | let listData = Immutable.fromJS([{posts: postsData.list, like: likeData.list, reply: replyData.list}]); |
242 | let isRefreshing = ptr; | 244 | let isRefreshing = ptr; |
@@ -284,6 +286,7 @@ class UserContainer extends React.Component { | @@ -284,6 +286,7 @@ class UserContainer extends React.Component { | ||
284 | isLoadingMore={isLoadingMore} | 286 | isLoadingMore={isLoadingMore} |
285 | onEndReached={this._onEndReached} | 287 | onEndReached={this._onEndReached} |
286 | rightButtonClick={this._rightButtonClick} | 288 | rightButtonClick={this._rightButtonClick} |
289 | + onBack={this._onBack} | ||
287 | /> | 290 | /> |
288 | </View> | 291 | </View> |
289 | ); | 292 | ); |
@@ -57,6 +57,7 @@ class UserThatNotMeContainer extends React.Component { | @@ -57,6 +57,7 @@ class UserThatNotMeContainer extends React.Component { | ||
57 | this._onPressComment = this._onPressComment.bind(this); | 57 | this._onPressComment = this._onPressComment.bind(this); |
58 | this._onPressLike = this._onPressLike.bind(this); | 58 | this._onPressLike = this._onPressLike.bind(this); |
59 | this._onEndReached = this._onEndReached.bind(this); | 59 | this._onEndReached = this._onEndReached.bind(this); |
60 | + this._onBack = this._onBack.bind(this); | ||
60 | 61 | ||
61 | this.sid = this.props.userThatNotMe.sid; | 62 | this.sid = this.props.userThatNotMe.sid; |
62 | } | 63 | } |
@@ -72,11 +73,14 @@ class UserThatNotMeContainer extends React.Component { | @@ -72,11 +73,14 @@ class UserThatNotMeContainer extends React.Component { | ||
72 | } | 73 | } |
73 | 74 | ||
74 | componentWillUnmount() { | 75 | componentWillUnmount() { |
76 | + this.props.actions.userThatNotMeClean(this.sid); | ||
77 | + } | ||
78 | + | ||
79 | + _onBack() { | ||
80 | + Actions.pop(); | ||
75 | if (shouldShowTabBar(this.props.navigationState)) { | 81 | if (shouldShowTabBar(this.props.navigationState)) { |
76 | - Actions.refresh({key: 'Home', showNativeTabBar: true}); | 82 | + ReactNative.NativeModules.YH_CommunityHelper.showTabBar(); |
77 | } | 83 | } |
78 | - | ||
79 | - this.props.actions.userThatNotMeClean(); | ||
80 | } | 84 | } |
81 | 85 | ||
82 | _onPressAvatar(uid) { | 86 | _onPressAvatar(uid) { |
@@ -124,6 +128,7 @@ class UserThatNotMeContainer extends React.Component { | @@ -124,6 +128,7 @@ class UserThatNotMeContainer extends React.Component { | ||
124 | onPressComment={this._onPressComment} | 128 | onPressComment={this._onPressComment} |
125 | onPressLike={this._onPressLike} | 129 | onPressLike={this._onPressLike} |
126 | onPressPost={this._onPressPost} | 130 | onPressPost={this._onPressPost} |
131 | + onBack={this._onBack} | ||
127 | /> | 132 | /> |
128 | </View> | 133 | </View> |
129 | ); | 134 | ); |
@@ -95,6 +95,9 @@ export function header(sid) { | @@ -95,6 +95,9 @@ export function header(sid) { | ||
95 | let {section} = getState(); | 95 | let {section} = getState(); |
96 | 96 | ||
97 | let item = section.items.get(sid); | 97 | let item = section.items.get(sid); |
98 | + if (!item) { | ||
99 | + return; | ||
100 | + } | ||
98 | 101 | ||
99 | if (item.isFetching) { | 102 | if (item.isFetching) { |
100 | return; | 103 | return; |
@@ -133,6 +136,9 @@ export function newPost(sid, ptr = false) { | @@ -133,6 +136,9 @@ export function newPost(sid, ptr = false) { | ||
133 | return (dispatch, getState) => { | 136 | return (dispatch, getState) => { |
134 | let {section, user} = getState(); | 137 | let {section, user} = getState(); |
135 | let item = section.items.get(sid); | 138 | let item = section.items.get(sid); |
139 | + if (!item) { | ||
140 | + return; | ||
141 | + } | ||
136 | 142 | ||
137 | // 接口请求跳出的条件: | 143 | // 接口请求跳出的条件: |
138 | // 前置条件:下拉刷新优先级高于上拉加载 | 144 | // 前置条件:下拉刷新优先级高于上拉加载 |
@@ -175,6 +181,10 @@ export function hotPost(sid, ptr = false) { | @@ -175,6 +181,10 @@ export function hotPost(sid, ptr = false) { | ||
175 | return (dispatch, getState) => { | 181 | return (dispatch, getState) => { |
176 | let {section, user} = getState(); | 182 | let {section, user} = getState(); |
177 | let item = section.items.get(sid); | 183 | let item = section.items.get(sid); |
184 | + if (!item) { | ||
185 | + return; | ||
186 | + } | ||
187 | + | ||
178 | // 接口请求跳出的条件: | 188 | // 接口请求跳出的条件: |
179 | // 前置条件:下拉刷新优先级高于上拉加载 | 189 | // 前置条件:下拉刷新优先级高于上拉加载 |
180 | if (ptr) { | 190 | if (ptr) { |
@@ -152,9 +152,11 @@ export default function sectionReducer(state = initialState, action) { | @@ -152,9 +152,11 @@ export default function sectionReducer(state = initialState, action) { | ||
152 | case SECTION_SET_ACTIVE_TAB: { | 152 | case SECTION_SET_ACTIVE_TAB: { |
153 | let {sid, tab} = action.payload; | 153 | let {sid, tab} = action.payload; |
154 | let item = state.items.get(sid); | 154 | let item = state.items.get(sid); |
155 | - item = item.set('activeTab', tab); | ||
156 | - let nextState = state.setIn(['items', sid], item); | ||
157 | - return nextState; | 155 | + if (item) { |
156 | + item = item.set('activeTab', tab); | ||
157 | + let nextState = state.setIn(['items', sid], item); | ||
158 | + return nextState; | ||
159 | + } | ||
158 | } | 160 | } |
159 | 161 | ||
160 | case POST_LIKE_REQUEST: { | 162 | case POST_LIKE_REQUEST: { |
@@ -60,6 +60,10 @@ export function getUserThatNotMeInfo(sid) { | @@ -60,6 +60,10 @@ export function getUserThatNotMeInfo(sid) { | ||
60 | return (dispatch, getState) => { | 60 | return (dispatch, getState) => { |
61 | let {userThatNotMe} = getState(); | 61 | let {userThatNotMe} = getState(); |
62 | let item = userThatNotMe.items.get(sid); | 62 | let item = userThatNotMe.items.get(sid); |
63 | + if (!item) { | ||
64 | + return; | ||
65 | + } | ||
66 | + | ||
63 | if (item.profile.isFetching || item.profile.error) { | 67 | if (item.profile.isFetching || item.profile.error) { |
64 | return; | 68 | return; |
65 | } | 69 | } |
@@ -103,6 +107,10 @@ export function userThatNotMePosts(sid) { | @@ -103,6 +107,10 @@ export function userThatNotMePosts(sid) { | ||
103 | return (dispatch, getState) => { | 107 | return (dispatch, getState) => { |
104 | let {user, userThatNotMe} = getState(); | 108 | let {user, userThatNotMe} = getState(); |
105 | let item = userThatNotMe.items.get(sid); | 109 | let item = userThatNotMe.items.get(sid); |
110 | + if (!item) { | ||
111 | + return; | ||
112 | + } | ||
113 | + | ||
106 | if (item.posts.isFetching || item.posts.error) { | 114 | if (item.posts.isFetching || item.posts.error) { |
107 | return; | 115 | return; |
108 | } | 116 | } |
-
Please register or login to post a comment