我正在尝试将surveyjs 结果发送到我的API。

在mounted() 中，我提出一个GET请求vue-resource，从我的dB 那里得到问题，然后设置surveyjs。为了发送结果，我尝试this.$http.post在surveyJSonComplete函数中使用 , 但我得到了Cannot read property 'post' of undefined. 另外，我试图将手表放在result变量上，但没有用。

mounted() {
    this.$http
      .get("myAPI")
      .then(res => res.json())
      .then(questions => {
        this.questions = questions;
        this.survey = new SurveyVue.Model(this.questions.pesquisa);
        this.survey.locale = "pt";

        this.survey.onComplete.add(function(survey) {
          this.result = survey.data;
          this.$http
          .post(
            `myAPI`,
            this.result,
            { headers: { "Content-Type": "application/json" } }
          )
          .then(response => {
            console.log(response);
            UIkit.notification({
              message: "Success",
              pos: "top-center",
              status: "success"
            });
          })
          .catch(error => {
            console.log(error);
            UIkit.notification({ …

我正在尝试使用vue-resource的ajax请求来填充vuejs中的数据.

但是当我要求vue-resource在控制台中返回此消息时: Uncaught TypeError:无法重新定义属性:$ url

代码中出现错误:

var Vue = require('vue');
Vue.use(require('vue-resource'));

我可以依赖this使用的内部数据工厂函数，因为它是当前组件对象实例吗？this我在文档中找不到data().

data() {
  return {
    results: [],
    apiResource: this.$resource('url...'), // <-- this used here
    loading: true,
  }
},

简单的测试表明这this是VueComponent这里的实例，但问题是框架是否允许以这种方式使用它。

我想动态确定适当的 http 方法并进行单个 api 调用。但是，当我调用该方法时会引发异常。

我希望我做错了什么而不是这是一个vue-resource错误。有人会有什么建议吗？谢谢

例如：

let method = this.$http.post

if (this.model.id) {
    method = this.$http.put
}

method(
    this.url,
    this.model,
    options
).then(response => {
    this.$router.push(this.redirect_to)
}).catch(response => {
    console.log(`Error: ${response.statusText}`)
})

一个 javascriptTypeError被抛出消息“这不是一个函数”

下面的代码有效，但有点啰嗦。

if (this.model.id) {
    this.$http.put(
        this.url,
        this.model,
        options
    ).then(response => {
        this.$router.push(this.redirect_to)
    }).catch(response => {
        console.log(`Error: ${response.statusText}`)
    })

} else {
    this.$http.post(
        this.url,
        this.model,
        options
    ).then(response => {
        this.$router.push(this.redirect_to)
    }).catch(response => {
        console.log(`Error: ${response.statusText}`)
    })
}

我正在尝试制作一个用 json 数据填充的 v-data-table （Vue + Vuetify + Vue-Resource）。我可以毫无问题地显示数据，但我需要更改标题的第一列以让用户实际查看的数据可见。目前我使用的是静态标头，没有我想要的标签：

headers: [
    {
      text: "",
      align: "left",
      sortable: false,
      value: "name",
      id: "primeiraColunaColuna"
    },

    { text: "total QTD", value: "total QTD" },
    { text: "total", value: "Total" },
    { text: "Date", value: "Date" },
    { text: "Time", value: "Time" }
  ],

我想让文本字段更改为 A、B、C、D 等。有什么办法可以实现这一点吗？

我有以下几点：

bidAmount: {
    amount: 0
},
userToken: {
    token: null
},

this.$http.post('/place-bet', this.bidAmount, function(response) {
    alert(response);
});

如何同时发送this.bidAmount和this.userToken

我已经尝试过了，但是发送不正确：

this.$http.post('/place-bet', [this.userToken, this.bidAmount], function(response) {
    alert(response);
});

我最近开始学习vue.js,目前正在使用vue.js和vue-simple-webpack模板,express和mongo来开发一个简单的应用程序.我正在使用localhost来开发和测试应用程序.

应用程序前端在端口8080中运行,服务器在不同的端口中运行(3000)

这是我的server.js地方,我有一个简单的api从我的数据获取数据localdb

const express = require('express');
const MongoClient = require('mongodb').MongoClient;
const mongodb = require('mongodb');
const bodyParser= require('body-parser');
const app = express();
var db;

var URL='mongodb://localhost:27017/'+'mydb';
console.log(URL);

app.use(express.static(__dirname + '/public'));
app.use(bodyParser.urlencoded({extended: true}))
app.use(bodyParser.json())

MongoClient.connect(URL, (err, database) => {
  if (err) 
    return console.log(err);
  db = database;
  app.listen(3000, () => {
    console.log('listening on 3000');
  })
})

app.get('/products', (req, res) => {
    db.collection('products').find().toArray(function(err, results) {
    console.log(results)
    res.setHeader('Content-Type', 'application/json');
    res.send(JSON.stringify(results));
    })
})

测试了server.js,它有效.见下面的截图.

Vue应用程序正在http://localhost:8080/使用webpack模板的默认配置运行.我试图 …

我在 Chrome 浏览器中遇到以下错误消息：

无法加载http://localhost:5000/my_endpoint：预检响应中的 Access-Control-Allow-Headers 不允许请求标头字段 Access-Control-Allow-Origin。

浏览器正在使用 webpack 等和vue-resource从 Vue.js 前端应用程序加载网页，以向 REST 后端执行 HTTP 请求。

URLhttp://localhost:5000/my_endpoint是由 python Flask 应用程序提供服务的 HTTP GET/POST 端点。

在前端 Javascript 上，我有这些 CORS 设置：

import VueResource from 'vue-resource'

Vue.use(VueResource)

Vue.http.options.crossOrigin = true
Vue.http.headers.common['Access-Control-Allow-Origin'] = '*'

在 Flask 应用程序的后端 python 代码中，我有以下 CORS 配置详细信息：

@app.after_request
def add_header(response):
    response.headers['Access-Control-Allow-Origin'] = '*'
    response.headers['Access-Control-Allow-Headers'] = 'Access-Control-Allow-Headers, Origin, X-Requested-With, Content-Type, Accept, Authorization'
    response.headers['Access-Control-Allow-Methods'] = 'GET, POST, PUT, DELETE, OPTIONS, HEAD'
    response.headers['Access-Control-Expose-Headers'] = '*'
    return response

在 Javascript …

我一直挑战自己编写一个应用程序，该应用程序可从API获取数据并在各种组件中显示数据。我对VueJS很陌生。我使用VueResource来访问API，使用VueX来进行状态管理。我已经设置了商店，添加了动作，变异和created获取方法等，并且在组件中添加生命周期方法后，我立即收到错误消息：

ReferenceError: Vue is not defined
    at Store.eval (eval at <anonymous> (build.js:1017), <anonymous>:11:3)
    at Array.wrappedActionHandler (eval at <anonymous> (build.js:1338), <anonymous>:711:23)
    at Store.dispatch (eval at <anonymous> (build.js:1338), <anonymous>:433:15)
    ...

我的代码如下所示：

main.js

import Vue from 'vue'
import App from './App.vue'
import VueResource from 'vue-resource'
import store from './store/store'

Vue.use(VueResource);

new Vue({
  el: '#app',
  store,
  render: h => h(App)
})

store.js

import Vue from 'vue'
import Vuex from 'vuex'
import actions from './actions'
import mutations from './mutations'
import getters from './getters' …

我正在尝试从 jQuery 更改为 Vue.js，但使用 vueresource 运行 Ajax 调用时遇到一些困难。下面是我正在使用的示例脚本，其中包含 jQuery 和 Vuejs。两者都尝试访问相同的 ajax 调用。jQuery 调用有效，vuejs 调用无效。正在调用 sendAjax 方法，因为前 2 个警报显示 - 然后什么也没有。

编辑 - 这只会在通过 Wordpress 运行 Ajax 调用时导致错误。在 WP 之外，它确实有效。有任何想法吗？？

<!DOCTYPE html>
<html>
    <head>
        <title>Vue Resource</title>

        <script src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>
        <script src="https://cdn.jsdelivr.net/vue/latest/vue.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/vue-resource@1.5.1"></script>
    </head>

    <body>
        <button id="jQueryAjax">Jquery AJAX</button>

        <div id="myvue"> 
            <button @click.prevent="sendAjax()">AJAX</button>
        </div>

        <script>
            let AjaxUrl = "http://localhost:8888/mySite/wp-admin/admin-ajax.php";
            const postData = { action: 'my_ajaxcall', function: 'AjaxTest' };

            Vue.use(VueResource);

            const ajax_app = new Vue({
                el: '#myvue',
                methods: {
                    sendAjax() {
                        alert("VueAjax");       
                        alert(JSON.stringify(postData)); …