摘要

Question

我收到一个奇怪的错误：vue-resource.common.js Uncaught TypeError: str.replace is not a function，它似乎与我正在进行的ajax调用有关，以获取一些数据：

export default {
    data: () => ({
      recipes: []
    }),
    ready() {
      this.$http.get('http://localhost:3000/recipes', { 
        headers: { 
          'Access-Control-Allow-Origin': true 
        }
      }).then((recipes) => {
        this.$set('recipes', recipes)
      })
    }
  };

我是vue.js的新手并且真的不确定如何调试这个...任何指针都会很棒。

非常感谢。

Answer 1

摘要

这是因为Vue资源中的标头值应为string类型，而不是boolean。

详细

我实际上并未在Vue资源文档中看到这一点，但查看源代码很容易看到：

标头的set方法（see here）调用trim函数：

set(name, value) {
    this.map[normalizeName(getName(this.map, name) || name)] = [trim(value)];
}

trim假设该值为字符串（see here）：

export function trim(str) {
    return str ? str.replace(/^\s*|\s*$/g, '') : '';
}

其他说明

正如问题的评论中所讨论的，您使用此标头的方式不正确。 Access-Control-Allow-Origin标头是响应上使用的内容，而不是请求。这在技术上与错误无关，但值得一提。

有关此标题和其他跨源请求问题的详细信息，请参阅the MDN docs on CORS

TypeError：str.replace与vue.js Ajax调用不是函数奇怪的错误

1 个答案:

摘要

详细

其他说明