Question

我有一个看似简单的vue.js组件，它导致应用无法编译：

<template>
<div>
  <div v-if="token"> 
    u R LOGED IN {{userid}}
  </div>
  <div v-else> 
    Token not found
  </div>


</div>

</template>

<script>
import axios from 'axios';

export default {
  name: 'AboutMe',

 created: {
    axios.get('http://127.0.0.1:3000/profile/aboutme/somejibberish'  )
    .then( res => { 
      console.log(res);

    })
    .catch( error => {  
      console.log(error);
    })
  }

}
</script>

我得到的错误是：

 ERROR  Failed to compile with 1 errors                                                                             

 error  in ./src/components/AboutMe.vue?vue&type=script&lang=js&

Syntax Error: SyntaxError: /home/me/vue-myapp/src/components/AboutMe.vue: Unexpected token, expected "," (122:9)

  120 | 
  121 |   created: {
> 122 |     axios.get('http://127.0.0.1:3000/profile/aboutme/fwefwefewf'  )
      |          ^
  123 |     .then( res => { 
  124 |       console.log(res);
  125 | 


 @ ./src/components/AboutMe.vue?vue&type=script&lang=js& 1:0-222 1:238-241 1:243-462 1:243-462
 @ ./src/components/AboutMe.vue
 @ ./src/routes.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://192.168.1.10:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

我在同一应用程序的其他组件中使用了公理，没有任何问题，所以不知道这里可能出什么问题吗？我该如何解决？

Answer 1

创建的属性必须是函数，而不是对象：

import axios from 'axios';

export default {
  created() {
    axios.get(...
  }
}

Answer 2

语法错误更改为：

created: function(){
    axios.get('http://127.0.0.1:3000/profile/aboutme/somejibberish'  )
    .then( res => { 
        console.log(res);

    })
    .catch( error => {  
        console.log(error);
    })
}

来源：https://vuejs.org/v2/guide/instance.html#Instance-Lifecycle-Hooks

或者如堕落的答案所示！

由于axios获取请求而无法编译vue.js应用

2 个答案: