时间戳

首页 > 解决方案 > 如何修复 axios 中的“TypeError：name.toUpperCase 不是函数”

vue.js - 如何修复 axios 中的“TypeError：name.toUpperCase 不是函数”

问题描述

我想使用 vue js 中的 axios 从 dbpedia 端点获取数据。

我用来axios.get从 dbpedia 获取数据，我在控制台中得到了错误说：

TypeError：name.toUpperCase 不是函数

我该如何解决？

created(){
    this.fetch();
  },
  methods: {
    fetch(){
      axios
      .get('http://id.dbpedia.org/sparql?query=SELECT+DISTINCT+?concept+WHERE+{+?s+a+?concept+}+LIMIT+50', {
        headers: 'Access-Control-Allow-Origin: *'
      }).then(response => {
        /* eslint-disable */
        console.log('SUCCESS');
        console.log(response);
      }).catch((e) => {
        console.log(e);
      })
    }
  },

标签： vue.jsaxiosdbpedia

解决方案

您需要将您的 Axios 请求更改为：

methods: {
async fetch () {
await axios.get('https://cors.io/?http://id.dbpedia.org/sparql?query=SELECT+DISTINCT+?concept+WHERE+{+?s+a+?concept+}+LIMIT+50', {
            headers: {'Access-Control-Allow-Origin': *},
             mode: 'cors',
          }).then(response => {
            /* eslint-disable */
            console.log('SUCCESS');
            console.log(response.data);
          }).catch((e) => {
            console.log(e);
          }
     }
}

五个变化：

1）把axios做成headers对象（注意引号在哪里）

2)console.log(response.data)

3) 添加mode: 'cors'

4)cors为 URL 添加前缀，因为您正在从托管环境之外的第三方域检索数据

5) 将您的fetch函数包装在 中async await，因为 axios 是一个基于承诺的库。

推荐阅读