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

Question

因此，我尝试在我的 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>

我正在关注官方示例，但我无法理解这里有什么问题！

标签： javascriptvue.jseslint

Answer 1

这是违反ESLint 规则的。解决方案是使用大括号来指示您的箭头函数实际上没有返回值

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

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