React:在jQuery statusCode之后调用函数

时间:2016-04-18 20:06:08

标签: javascript

免责声明:我是javascript的新手。

当我点击标有" Logga in"我调用函数handleLogin()。如果返回200 OK,我想调用函数handleOpen。

当我尝试使用下面显示的代码执行此操作时,我得到" Uncaught ReferenceError:handleOpen未定义"我不知道为什么。

import React from 'react';
import RaisedButton from 'material-ui/lib/raised-button';
import Dialog from 'material-ui/lib/dialog';
import FlatButton from 'material-ui/lib/flat-button';
import TextField from 'material-ui/lib/text-field';


const styles = {
    container: {
        textAlign: 'center',
        paddingTop: 200
    }
};

class Main extends React.Component {
  constructor(props, context) {
    super(props, context);
    this.handleClose = this.handleClose.bind(this);
    this.handleOpen = this.handleOpen.bind(this);
    this.handleLogin = this.handleLogin.bind(this);
    this.handleSend = this.handleSend.bind(this);

    this.state = {
        open: false
    };
  }

    handleClose() {
        this.setState({
            open: false
        });
    }

    handleOpen() {
        this.setState({
            open: true
        });
    }

  handleLogin() {
      $.ajax({
          type: 'GET',
          url : "a url",
          statusCode: {
              200: function () {
                  alert('200');
                  handleOpen
              },
              401: function () {
                  alert('401');
              }
          }
      });
  }

    handleSend() {
        $.ajax({
            type: 'GET',
            url : "a url",
            statusCode: {
                200: function () {
                    alert('200');
                },
                404: function () {
                    alert('404');
                }
            }
        });
    }

    render() {
        const standardActions = (
            <div>
                <FlatButton
                    label="Avbryt"
                    secondary={true}
                    onTouchTap={this.handleClose}
                />

                <FlatButton
                    label="Skicka"
                    primary={true}
                    onTouchTap={this.handleSend}
                />
            </div>
        );

        return (
            <div style={styles.container}>
                <Dialog
                    open={this.state.open}
                    actions={standardActions}
                    onRequestClose={this.handleClose}
                    modal={true}
                >

                    <TextField
                        ref="recipientField"
                        floatingLabelText="Mottagare"
                    /><br/>

                    <TextField
                        ref="messageField"
                        floatingLabelText="Skriv ditt meddelande"
                        multiLine={true}
                        fullWidth={true}
                    />
                </Dialog>

                <TextField
                    ref="usernameField"
                    floatingLabelText="Användarnamn"
                    style={{
                    width: '20%'
                    }}
                />

                <TextField
                    ref="passwordField"
                    floatingLabelText="Lösenord"
                    type="password"
                    style={{
                    width: '20%'
                    }}
                /><br/>

                <RaisedButton
                    label="Logga in"
                    primary={true}
                    onTouchTap={this.handleLogin}
                    style={{
                    width: '40%'
                    }}
                />
            </div>
        );
    }
}

export default Main;

0 个答案:

没有答案