Question

我正在尝试将XHR添加到Vue。我得到错误XHR没有定义。我按照XHR说明，与NPM一起安装，将其添加到别名下的webpack.base文件中。我在模板文件中调用了vue-cli锅炉板附带的Hello.vue文件。我使用“npm run dev”我需要以某种方式重建吗？

resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
  'vue$': 'vue/dist/vue.esm.js',
  '@': resolve('src'),
  'request$': 'xhr'
}

}，

来自标签内的Hello.vue

xhr({
uri: "http://localhost:8081/service",
headers: {
    "Content-Type": "application/json"
}

}, function (err, resp, body) {
    list = resp;
})

Hello.vue中的代码

    <script>
var xhr = require("xhr")

var spells = [];

function doGetSpells(){

        //var self = this;
        xhr({
          uri: "http://localhost:8081/spellNames",
          headers: {
              "Content-Type": "application/json"
          }
      }, function (err, resp, body) {              
          spells = JSON.parse(body);
          console.log(spells);
      })           
}

export default {
  name: 'sideBar',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App',
      spellList: spells   
    }
  },
  methods: {
    getSpells(){
      doGetSpells();
    },
    mounted () {
      doGetSpells();
    }
  }

}
</script>

Answer 1

var xhr = require("xhr")

xhr.get('/post-to-me', function(err, resp) {
   // callback
})

您应该将回调函数作为参数传递，它将在操作完成时调用。

在你的回调中，你可以使用＆＃34来访问你的Vue实例;这个＆＃34;：

this.spellList = []

将XHR添加到Vue JS webpack

1 个答案: