1

我在一个屏幕上有一个用户列表https://screencast.com/t/RQp8IrWdV5qf，当您单击列表中的任何项目时，它会通过调度showProfile具有用户 ID 的操作来显示单个用户，您可以通过 ListItem 代码看到：

import React, {Component, PropTypes} from 'react'
import { connect } from 'react-redux'
import {StyleSheet, View, Text, Image, TouchableOpacity} from 'react-native'
import {Actions} from 'react-native-router-flux'
import { showProfile } from '../../actions'

const ListItem = ({ user, dispatch }) => {
    return (
        <TouchableOpacity style={styles.container}
            onPress={() => {
                dispatch(showProfile(user.id));
                Actions.profile();
            }}
        >
            <View style={styles.left}>
                <Image style={styles.image} source={{uri:user.avatar.thumb}} />
                <View style={styles.text}>
                    <Text style={styles.title}>{user.display_name}</Text>
                </View>
            </View>
        </TouchableOpacity>
    )
}

ListItem.propTypes = {
    dispatch: PropTypes.func.isRequired,
    user: PropTypes.object.isRequired
}

export default connect()(ListItem);

我想要的是，当我单击右下角的“个人资料”选项卡时，打开具有特定 ID 的用户的个人资料（登录用户）：

import React from 'react'
import { Provider } from 'react-redux'
import configureStore from './configureStore'
import { Router, Scene, Route } from 'react-native-router-flux'
import Members from './components/Members/List'
import Profile from './components/Profile'
import { Text } from 'react-native'
import { showProfile } from './actions'

const Kernel = () => (
  <Provider store={configureStore()}>
      <Router>
        <Scene key="root">
          {/* Tab Container */}
          <Scene
            key="tabbar"
            tabs={true}
            tabBarStyle={{ backgroundColor: '#FFFFFF' }}
          >
            {/* Tab and it's scenes */}
            <Scene key="members" title="Members" icon={TabIcon} component={Members} initial={true}>
            </Scene>
            {/* Removed for brevity */}
            {/* Tab and it's scenes */}
            <Scene key="profile" title="Profile" icon={TabIcon} component={Profile} onEnter={dispatch(showProfile(1))}>
            </Scene>
            {/* Removed for brevity */}
          </Scene>
        </Scene>
      </Router>
  </Provider>
)

如您所见，我正在尝试做类似的事情onEnter={dispatch(showProfile(1))}。这样做的正确方法是什么？

4

1 回答 1

0

用这段代码完成了它：

let TabIcon = ({ selected, title, dispatch }) => {
    if(title == "Profile") {
        return (
            <Text
                style={{color: selected ? 'red' :'black'}}
                onPress={() => {
                    if(title == "Profile") {
                        dispatch(showProfile(1));
                        Actions.profile();
                    }
                }}
            >{title}</Text>
        );
    }
    return (
        <Text
            style={{color: selected ? 'red' :'black'}}
        >{title}</Text>
    );
}

TabIcon = connect()(TabIcon);
于 2017-01-28T20:12:16.033 回答