Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面的方法
2018-08-09 09:47
1266 查看
1. 引入jquery和vue.js
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <script type="text/javascript" src="http://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
2. JS
<script type="text/javascript"> $(function(){ vm = new Vue({ el:'#lst', data:{ mcs : [] } }); getmc(); }); function getmc(){ $.get("getJsonData.action", function(msg){ vm.mcs = msg }); } </script>
3. HTML
<div id="lst" v-cloak> <div v-for="mc in mcs"> <p> <a :href="'abbbbb.action?id=' + mc.id " rel="external nofollow" >{{mc.titles}}</a> </p> </div> </div><p> <input type="button" onclick="getmc()" value="更新页面" /> </p>
以上这篇Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面
- vue.js通过自定义指令实现数据拉取更新的实现方法
- vue.js通过自定义指令实现数据拉取更新的实现方法
- android之通过webview实现与js方法相互调用,数据交互
- 通过jquery ajax在从服务器获取一个文件的数据,显示到客户端的页面
- js实现文本框中输入文字页面中div层同步获取文本框内容的方法
- JS实现获取键盘按下的按键并显示在页面上的方法
- javascript获取超链接传递的参数,此方法亦能解决2个通过js超链页面传递参数的乱码问题
- 通过服务器获取终端上应用软件更新数据的方法和系统
- js页面用定时任务通过AJAX获取后台数据,但是从这个页面跳转到其他页面后,定时任务仍然在定时请求后台
- JS实现获取键盘按下的按键并显示在页面上的方法
- 页面向下滚动ajax获取数据的实现方法(兼容手机)
- js实现手机端可以上拉刷新,动态通过ajax从后台获取数据
- 基于对象的JavaScript实现无刷新页面发送和获取数据Ajax.js
- JS获取中文拼音首字母并通过拼音首字母快速查找页面内对应中文内容的方法【附demo源码】
- 通过两种方法实现在HTML页面加载完毕后运行某个js
- 使用 Cufon 渲染网页字体(转载自ibm developerwork,在网页里引入特殊字体的方法,通过js实现字体渲染)(1)
- 实用js小汇总--获取iframe引用的页面中的控件ID,或赋值的实现方法
- JS实现点击按钮获取页面高度的方法
- WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据