为了找到vue.js的vue-resource插件的任何预先使用的示例而苦苦挣扎,我尝试了这个:
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/0.12.7/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/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.org/ip', function (data, status, request) {
// set data on vm
this.$set('origin', data)
}).error(function (data, status, request) {
// handle error
})
}
})
</script>
只查询httpbin.org/ip(我能找到的随机REST端点)并在#myview > p
内显示结果。这只是我试图运行的vue-resource github page上提供的示例(改编版本)。
任何人都可以看到我无法实现这一目标吗?
编辑:添加了逗号,here是其中的小提琴。
答案 0 :(得分:7)
因为您正在使用require
。如果您使用require
,则需要一些像http://browserify.org/
此示例现在正在运行: http://jsfiddle.net/dccbbkam/2/
这是另一个例子: http://jsfiddle.net/dccbbkam/4/