用Vue.js往前端填充数据时遇到的问题

绑定背景图片

v-bind:style="{ backgroundImage: 'url(' + image + ')' }"

截取当前网页的参数

var message;

            window.onload = main;

            var src = window.location.href;

            var id = src.split("?")[1].split("=")[1];

ajax跨域访问的问题

//获取所有的游戏列表
var message;
window.onload = main;
function main(){
$.jsonp({
"url": "http://124.232.135.216:8068/gamejoynew/game/gamelist",callbackParameter: "callback",
"success": function(data) {
message = data.data;
var all = new Vue({
el:'#all',
data:{
items : message
},
methods:{
topage:function($index){
window.location = "detail.html?id=" + message[$index].gameid;
}
}
});
},
"error": function(d,msg) {
alert("获取失败，请检查您的网络设置"+msg);
}
})

}

绑定点击事件，但是用Vue的方式绑定的方法都必须写在new Vue里面

v-on:click="topage($index + 1);"

所有要用到Vue.js的都必须放在el指向的元素下，不然vue就不会执行到。

利用ajax进行后台数据访问时有时候需要跨域  ，跨域就是系统为了安全进行的一种保护措施，就是你访问的时候需要先想服务器发送请求，然后服务器再返回数据给你，这就导致了服务器返回的不是简单的json数据了，而是另外的jsonp格式的数据，用ajax直接访问时就会报错，这个时候就可以用到jQuery的一个jsonp插件可以直接处理这些数据然后返回给你json数据，只要在jQuery之后引用就可以了，一般提示说jsonp不是方法都是因为你的jsonp插件导入的位置一定要在jQuery最后一次导入之后导入。