Vue.js與jQuery不沖突???
在實際的應用中,幾乎90%的數據是來源于服務端的,前端和服務端之間的數據交互一般是通過ajax請求來完成的。
說到ajax請求,第一反應肯定想到了jQuery,項目中如果引入jQuery會幫助我們簡化很多操作,簡化DOM操作,ajax方法獲取后端數據等。
然而,Vue.js和jQuery沖突嗎???
答案顯然是不沖突?。?!
接下來會實現Vue.js組件中使用jQuery的ajax方法獲取服務器端數據并綁定至組件的data中。
創建Vue.js單文件組件
<template> <div> <div class="id">{{ret}}</div> <div class="id">{{data}}</div> </div></template><script> export default{ name:'Test', data(){ return{ ret:'', data:'' } }, mounted(){ this.$nextTick(()=>{ var that=this; $.ajax({ type:"get", url:"http://wuanlife_api/index.php/Post/get_collect_post", data:{user_id:1}, success:function(data){ that.ret=data.ret; that.data=data.data; } }) }) } }</script><style> .id{ font-size: 25px; position: relative; left:50px; right:50px; }</style>
json數據
頁面效果
在ajax獲取數據后將獲取到的數據綁定到組件對象的data上,就能完成數據的獲取。
這樣頁面中就能正確的使用從服務器端獲取的數據來渲染了。
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。
新聞熱點
疑難解答