link3014 link3015 link3016 link3017 link3018 link3019 link3020 link3021 link3022 link3023 link3024 link3025 link3026 link3027 link3028 link3029 link3030 link3031 link3032 link3033 link3034 link3035 link3036 link3037 link3038 link3039 link3040 link3041 link3042 link3043 link3044 link3045 link3046 link3047 link3048 link3049 link3050 link3051 link3052 link3053 link3054 link3055 link3056 link3057 link3058 link3059 link3060 link3061 link3062 link3063 link3064 link3065 link3066 link3067 link3068 link3069 link3070 link3071 link3072 link3073 link3074 link3075 link3076 link3077 link3078 link3079 link3080 link3081 link3082 link3083 link3084 link3085 link3086 link3087 link3088 link3089 link3090 link3091 link3092 link3093 link3094 link3095 link3096 link3097 link3098 link3099 link3100 link3101 link3102 link3103 link3104 link3105 link3106 link3107 link3108 link3109 link3110 link3111 link3112 link3113 link3114 link3115 link3116 link3117 link3118 link3119 link3120 link3121 link3122 link3123 link3124 link3125 link3126 link3127 link3128 link3129 link3130 link3131 link3132 link3133 link3134 link3135 link3136 link3137 link3138 link3139 link3140 link3141 link3142 link3143 link3144 link3145 link3146 link3147 link3148 link3149 link3150

[Vue.js] Automatic refresh with specific request - VueJS, Axios

During the development of a single page application in VueJS, I’ve noticed a strange behavior with two different requests with Axios.

This first request returns a normal result and can be processed as it to be.
HTTP is only the object created by axios.create

const initGit = {
das: this.message,
password: this.password
};‘git/initGit’, qs.stringify(initGit), this.config)
.then(res => {
.catch(err => {

This request works like a charm :-)

However, when I replace this first request with the request below.

const body = {
skill : this.newSkill
};‘git/pushGit’, qs.stringify(body), this.config)
.then(res => {
.catch(err => {

It causes a page refresh.

I had this behavior in the method part of my vue.js file. I’ve tried in the watch part as well but the behavior is the same.

I definitely don’t understand how one of two requests which work when I check on the network tab in console causes a refresh even before the response of the server.

Please help !!!! :-)

Solution :

@varit05 This is the template code of my stepper step which includes the call to the watcher to realize the 2 requests.

<v-stepper-content step=”3”>
<v-form onsubmit=”return false;”>
<div class=”new-skill-step”>
label=”New Skill”
@keyup.enter=”sendNewSkill = ‘’”
<v-btn :disabled=”!buttonWriteSkillEnabled” round color=”primary” @click=”sendNewSkill = ‘’”>
Write new skill

Solution 2:

I’ve tried to move the HTTP request part of my program in another method. It still refeshes the page.

What is wrong with that request ?