Где я должен написать код Axios в реагировать? - PullRequest
Новая
       21

Где я должен написать код Axios в реагировать?

0 голосов
/ 24 сентября 2018

Я бы хотел, чтобы axios работал, когда я нажимал кнопку.Затем я пишу такой код:

axiosGet.js 

showState = () => {

        axios({
            url: 'http://127.0.0.1:8000/profile/',
            method: 'POST',
        })
        .then(res => {
        console.log(res);
        })
        .catch(err => {
            console.log(err);
        })
    }

...

render() {
     return (
          ...
          <button onClick={this.showState}>Show state</button>
          ...
     )
}

и views.py 

class SettingView(viewsets.ModelViewSet) :
    queryset = models.Category.objects.all()
    serializer_class = CategorySerializer

    def get(self, request) :
        return Response("ok")

    def post(self, request, format=None):
        return Response("ok")

Нет ответа, нет ошибки.

Разве я не должен использовать axios в обычном обработчике событий?Или есть какие-то требования, которые я должен учитывать при использовании axios в реагировать?

Ответы [ 3 ]

0 голосов
/ 24 сентября 2018

Я считаю, что вы должны сделать запрос get вместо post.Вы можете получить данные в res.data

    axios({
        url: 'http://127.0.0.1:8000/profile/',
        method: 'get',
    })
    .then(res => {
        console.log(res.data);
    })
    .catch(err => {
        console.log(err);
    })
0 голосов
/ 24 сентября 2018

Несмотря на написание axios.get, axios.post и других методов.я предпочитаю писать некоторые общие методы, которые необходимо вызывать, когда нам нужно запустить любой запрос к серверу для получения данных из API.

Мой пример кода .... создал файлкак axiosService.js и использовал этот файл там, где это необходимо, и просто используйте метод ApplicationApiHostServ_Axios со всем необходимым набором параметров.

`/ ** * ApplicationApiHostServ_Axios вернет данные в формате json ... * @param {*} url - путь к api ... * @param {*} - GET / POST / PUT / DELETE / ... * @param {*} responseType - Application / json / .... * @param {*}data - содержит параметры для передачи на сервер API в качестве запроса.* @param {*} callback - метод обратного вызова, который должен быть запущен при успешном ответе.* @param {*} failCallback - метод failCallback, который должен быть запущен при сбое ответа.* / ApplicationApiHostServ_Axios (url, метод, responseType, данные, обратный вызов, failCallback) {let ApplicationApiHost = new ApplicationApiHostServices ();if (method == 'get') {this.ApplicationApiHostServ_AxiosGet (url, responseType, data, callback, failCallback);} else if (method == 'post') {this.ApplicationApiHostServ_AxiosPost (url, responseType, data, callback, failCallback);} else if (method == 'put') {this.ApplicationApiHostServ_AxiosPut (url, responseType, data, callback, failCallback);} else if (method == 'delete') {this.ApplicationApiHostServ_AxiosDelete (url, responseType, data, callback, failCallback);}} 

/**
 * ApplicationApiHostServ_AxiosGet will pass a get request, To call an api.
 * @param {*} url - Path to api...
 * @param {*} responseType - Application/json /....
 * @param {*} data - Contains parameters to be passed to api server as request.
 * @param {*} callback - A callback method to be ececuted on success response.
 * @param {*} failCallback - A failCallback method to be ececuted on fail response.
 */
ApplicationApiHostServ_AxiosGet(url, responseType, data, callback, failCallback) {
    axios.get(API_HOST_ADDRESS + url, data)
        .then((response) => {
            if (isFunction(callback))
                callback(response);
        })
        .catch(function (error) {
            if (isFunction(failCallback))
                failCallback(error);
            else if (process.env.NODE_ENV === 'development')
                console.log(error);
        });
}

/**
* ApplicationApiHostServ_AxiosPost will pass a post request, To call an api.
* @param {*} url - Path to api...
* @param {*} responseType - Application/json /....
* @param {*} data - Contains parameters to be passed to api server as request.
* @param {*} callback - A callback method to be ececuted on success response.
* @param {*} failCallback - A failCallback method to be ececuted on fail response.
*/
ApplicationApiHostServ_AxiosPost(url, responseType, data, callback, failCallback) {
    axios.post(API_HOST_ADDRESS + url, data)
        .then(function (response) {
            if (isFunction(callback))
                callback(response);
        })
        .catch(function (error) {
            if (isFunction(failCallback))
                failCallback(error);
            else if (process.env.NODE_ENV === 'development')
                console.log(error);
        });
}

/**
* ApplicationApiHostServ_AxiosPut will pass a put request, To call an api.
* @param {*} url - Path to api...
* @param {*} responseType - Application/json /....
* @param {*} data - Contains parameters to be passed to api server as request.
* @param {*} callback - A callback method to be ececuted on success response.
* @param {*} failCallback - A failCallback method to be ececuted on fail response.
*/
ApplicationApiHostServ_AxiosPut(url, responseType, data, callback, failCallback) {
    axios.put(API_HOST_ADDRESS + url, data)
        .then(function (response) {
            if (isFunction(callback))
                callback(response);
        })
        .catch(function (error) {
            if (isFunction(failCallback))
                failCallback(error);
            else if (process.env.NODE_ENV === 'development')
                console.log(error);
        });
}

/**
* ApplicationApiHostServ_AxiosDelete will pass a delete request, To call an api.
* @param {*} url - Path to api...
* @param {*} responseType - Application/json /....
* @param {*} data - Contains parameters to be passed to api server as request.
* @param {*} callback - A callback method to be ececuted on success response.
* @param {*} failCallback - A failCallback method to be ececuted on fail response.
*/
ApplicationApiHostServ_AxiosDelete(url, responseType, data, callback, failCallback) {
    axios.delete(API_HOST_ADDRESS + url, data)
        .then(function (response) {
            if (isFunction(callback))
                callback(response);
        })
        .catch(function (error) {
            if (isFunction(failCallback))
                failCallback(error);
            else if (process.env.NODE_ENV === 'development')
                console.log(error);
        });
}`
0 голосов
/ 24 сентября 2018

Попробуйте это 

axios.get('http://127.0.0.1:8000/profile/')
    .then(res => {
    console.log(res);
    })
    .catch(err => {
        console.log(err);
    });

Проверьте ваш API в почтальоне один раз.

...