javascript - Getting started with vue-resource - Stack Overflow

admin管理员组

文章数量:1279237

Struggling to find any pre-made examples of use for the vue-resource plugin of vue.js, I tried this :

<script src=".12.7/vue.min.js"></script>
<script src=".1.13/vue-resource.min.js"></script>

<div id="my_view">
  <p>{{ origin }}</p>
</div>

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

new Vue({
    el: '#my_view',
    data: {
       origin: ''
    },

    ready: function() {

        // GET request
        this.$http.get('', function (data, status, request) {

            // set data on vm
            this.$set('origin', data)

        }).error(function (data, status, request) {
            // handle error
        })
      }
})
</script>

to just query httpbin/ip (a random REST endpoint i could find) and display the result inside #myview > p. It's just the example (an adapted version) provided on the vue-resource github page that I'm trying to run.

Can anyone see what I'm not getting right to achieve this ?

Edit: added ma, and here is the fiddle of it.

Struggling to find any pre-made examples of use for the vue-resource plugin of vue.js, I tried this :

<script src="https://cdnjs.cloudflare./ajax/libs/vue/0.12.7/vue.min.js"></script>
<script src="https://cdnjs.cloudflare./ajax/libs/vue-resource/0.1.13/vue-resource.min.js"></script>

<div id="my_view">
  <p>{{ origin }}</p>
</div>

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

new Vue({
    el: '#my_view',
    data: {
       origin: ''
    },

    ready: function() {

        // GET request
        this.$http.get('http://httpbin/ip', function (data, status, request) {

            // set data on vm
            this.$set('origin', data)

        }).error(function (data, status, request) {
            // handle error
        })
      }
})
</script>

to just query httpbin/ip (a random REST endpoint i could find) and display the result inside #myview > p. It's just the example (an adapted version) provided on the vue-resource github page that I'm trying to run.

Can anyone see what I'm not getting right to achieve this ?

Edit: added ma, and here is the fiddle of it.

• javascript
• javascript-framework
• vue.js

Share Improve this question Follow edited Aug 19, 2015 at 14:37 Nicolas Marshall asked Aug 18, 2015 at 21:02 Nicolas MarshallNicolas Marshall 4,45699 gold badges4141 silver badges6060 bronze badges 1

• Any syntax or other errors in the javascript console? There's a ma missing before "ready". Can help further if you turn this into a fiddle. – David K. Hess Commented Aug 19, 2015 at 2:49

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

Its because you are using require. If you use require you need some lib like http://browserify/

This example is now working: http://jsfiddle/dccbbkam/2/

And here is another example for you: http://jsfiddle/dccbbkam/4/

本文标签： javascriptGetting started with vueresourceStack Overflow