Question

这里是App.js的本机0.59应用程序（反应导航3.4.1）：

const socket = io(GLOBAL.BASE_URL, {
  transports: ['websocket'],
  jsonp: false
});

var props = {
  eventId: "",
  user: "",
  socket: socket
};
const ChatWithSocket = (props) => (<Chat {...props} />)

//create the navigator
const navigator = createStackNavigator(
  {
    Event:  Event,
    Chat: {
      screen: ChatWithSocket,

    } 
  }, {
    initialRouteName: "Event"
  }
);

//export it as the root component
export default createAppContainer(navigator);

此处props由3个项eventId, user and socket定义。前两个项被分配为“”，套接字被分配为常量socket的值。

this.props.navigation.navigate("Chat", {eventId: id, user: this.state.user});

这是Event组件中的代码，它带有2个道具Chat导航到eventId and user。问题是socket中的props在Chat中丢失了。这是道具的输出：

04-14 14:29:09.149 20137 20199 I ReactNativeJS: 'Props in chat : ', { screenProps: undefined,
04-14 14:29:09.149 20137 20199 I ReactNativeJS:   navigation:
04-14 14:29:09.149 20137 20199 I ReactNativeJS:    { pop: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      popToTop: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      push: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      replace: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      reset: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      dismiss: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      goBack: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      navigate: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      setParams: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      state:
04-14 14:29:09.149 20137 20199 I ReactNativeJS:       { params:
04-14 14:29:09.149 20137 20199 I ReactNativeJS:          { eventId: 1,
04-14 14:29:09.149 20137 20199 I ReactNativeJS:            user:
04-14 14:29:09.149 20137 20199 I ReactNativeJS:             { id: 1,
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               name: 'test uer1',
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               email: null,
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               cell: '123456789',
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               cell_country_code: '1',
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               comp_name: null,
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               status: 'active',
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               role: 'admin',
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               device_id: '02f7e7aa907a2a2b',
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               user_data: { user_secret: '' },
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               last_updated_by_id: null,
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               createdAt: '2019-04-06T07:00:00.000Z',
04-14 14:29:09.149 20137 20199 I ReactNativeJS:               updatedAt: '2019-04-06T07:00:00.000Z' } },
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         routeName: 'Chat',
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         key: 'id-1555277341463-1' },
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      router: undefined,
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      actions:
04-14 14:29:09.149 20137 20199 I ReactNativeJS:       { pop: [Function: pop],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         popToTop: [Function: popToTop],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         push: [Function: push],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         replace: [Function: replace],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         reset: [Function: reset],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         dismiss: [Function: dismiss],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         goBack: [Function: goBack],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         navigate: [Function: navigate],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:         setParams: [Function: setParams] },
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      getParam: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      getChildNavigation: [Function: getChildNavigation],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      isFocused: [Function: isFocused],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      dispatch: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      getScreenProps: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      dangerouslyGetParent: [Function],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      addListener: [Function: addListener],
04-14 14:29:09.149 20137 20199 I ReactNativeJS:      emit: [Function: emit] } }

在App.js中定义const ChatWithSocket时进行了以下尝试，它们都持有socket的值，但没有采用eventId and user组件中的Event的最新分配值：

var props = {
  eventId: "",
  user: "",
  socket: socket
};
const ChatWithSocket = () => (<Chat {...props} />)

和：

var props = {
  eventId: "",
  user: "",
};
const ChatWithSocket = () => (<Chat {...props} socket=socket />)

最初分配的道具因传播属性而丢失

0 个答案: