使用axios获取api数据时箭头函数不应该返回赋值（Vue.js 2）答案

【问题标题】：Arrow function should not return assignment when using axios to get api data (Vue.js 2)使用axios获取api数据时箭头函数不应该返回赋值（Vue.js 2）
【发布时间】：2020-10-26 02:00:17
【问题描述】：

所以我试图在我的 vue 应用程序中使用 Axios 从 URL 获取数据，但它一直返回以下错误： Arrow function should not return assignment

完整的错误输出：

error: Arrow function should not return assignment (no-return-assign) at src\components\navbar.vue:123:13:
  121 |   created() {
  122 |     axios.get('http://ip-api.com/json')
> 123 |       .then((response) => (this.countryCode = response.countryCode));
      |             ^
  124 |   },
  125 | };
  126 | </script>


1 error found.

我的代码：

<script>
import axios from 'axios';

export default {
  name: 'navbarr',
  data() {
    return {
      countryCode: null,
      country: '',
      countries: [
        { value: 'INT' },
        { value: 'UK' },
        { value: 'PT' },
        { value: 'US' },
        { value: 'FR' },
        { value: 'DE' },
        { value: 'IT' },
        { value: 'ES' },
        { value: 'IE' },
      ],
    };
  },
  created() {
    axios.get('http://ip-api.com/json')
      .then((response) => (this.countryCode = response.countryCode));
  },
};
</script>

我按照官方的例子，我不明白这里有什么问题！

【问题讨论】：

您是否尝试将函数体括在括号中。

标签： javascript vue.js eslint

【解决方案1】：

这是ESLint rule 违规行为。解决办法是用大括号表示你的箭头函数实际上没有返回值

.then((response) => {
  this.countryCode = response.countryCode
})

另一个选项是在您的 ESLint 配置中设置 except-parens 选项。

【讨论】：

传奇人物菲尔！