Question

我的代码是react-native@0.17

import React, { AsyncStorage, Component, View, Text, WebView, WebSocket } from 'react-native';
import { Avatar, Divider, Subheader, COLOR } from 'react-native-material-design';

export default class Avatars extends Component {
    _setWebSocket = (endpoint, sessionToken) => {
      const ws = new WebSocket('wss://' + endPoint + '/api/live?authToken=' + sessionToken);
      console.log('Setting socket: ' + 'wss://' + endpoint + '/api/live?authToken=' + sessionToken);

我正在调用代码：

componentDidMount() {
   this._setWebSocket(endpoint, token);
 }

我遇到了尝试让WebSockets作为代码运行的问题：

console.log('Setting socket: ' + 'wss://' + endpoint + '/api/live?authToken=' + sessionToken);

永远不会被触发。如果我在创建新WebSocket之前放入控制台日志，它就会运行。我做错了什么以及我如何调试chrome并不能与Genymotion一起显示有用的信息。

Answer 1

您的语法错误：这里有两种不同的正确代码方式。

class Avatars extends Component {
  constructor(props) {
    super(props)
    this._setWebSocket = this._setWebSocket.bind(this)
  }

  _setWebSocket(endpoint, sessionToken) {
    const ws = new WebSocket('wss://' + endPoint + '/api/live?authToken=' + sessionToken)
    console.log('Setting socket: ' + 'wss://' + endpoint + '/api/live?authToken=' + sessionToken)
  }

  componentDidMount() {
    this._setWebSocket(endpoint, token)
  }

  render() {
    // put your code here
    return (
      <View />
    )
  }
}

export default Avatars

或

const Avatars = React.createClass({
  _setWebSocket: (endpoint, sessionToken) => {
    const ws = new WebSocket('wss://' + endPoint + '/api/live?authToken=' + sessionToken)
    console.log('Setting socket: ' + 'wss://' + endpoint + '/api/live?authToken=' + sessionToken)
  },

  componentDidMount: () => {
    this._setWebSocket(endpoint, token)
  },

  render: () => {
    // put your code here
    return (
      <View />
    )
  },
})

export default Avatars

Answer 2

问题很容易找到，可能我累了

import React, { AsyncStorage, Component, View, Text, WebView, WebSocket } from 'react-native';

我把WebSocket导入但是这是原生模块...... 因此从导入依赖项中删除WebSocket有所帮助。

React Native并使用websockets

2 个答案: