当前位置: 首页 > 编程笔记 >

Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面的方法

司空炯
2023-03-14
本文向大家介绍Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面的方法,包括了Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面的方法的使用技巧和注意事项,需要的朋友参考一下

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通过自定义指令实现数据拉取更新的实现方法,包括了vue.js通过自定义指令实现数据拉取更新的实现方法的使用技巧和注意事项,需要的朋友参考一下 前言 这篇文章的代码片段位于 vue 的单文件组件中,即以 .vue 结尾的文件中,本文说明的只是一种实现方法,既不是唯一的方法也不是最好的方法,如果大家有更好的方法可以留言,大家进行讨论。 第一步 首先,一定要先定义变量: 第二步

  • 本文向大家介绍vue.js,ajax渲染页面的实例,包括了vue.js,ajax渲染页面的实例的使用技巧和注意事项,需要的朋友参考一下 关于上次说的用vue.js,zepto,node.js,webpack等技术重构CNode。这是一个比较入门的项目,一般你学完vue就可以上手了,CNode网站有公开的API所以你可以获取这个网站的所有数据接口,然后渲染到页面上,用CSS等加工一下就可以了。起初,

  • 本文向大家介绍vue 刷新之后 嵌套路由不变 重新渲染页面的方法,包括了vue 刷新之后 嵌套路由不变 重新渲染页面的方法的使用技巧和注意事项,需要的朋友参考一下 解决嵌套路由刷新时,路由没有变化,正常情况下页面是不会重新渲染的 1、在router-view中加上条件渲染 v-if 默认为true。让它显示出来 2、写写一个reload方法,在页面刷新只有,点击某个查询条件的时候调用这个重载的方法

  • 问题内容: 我曾经使用此代码片段重新渲染“推文”按钮。 但是看起来widgets.js(http://platform.twitter.com/widgets.js)已被修改,因此twttr.TweetButton不再是构造函数。 谁能解决这个问题? 问题答案: 似乎从来没有支持过构造函数,现在在上一次API更新之后不再起作用: http://groups.google.com/group/twi

  • 本文向大家介绍vue异步axios获取的数据渲染到页面的方法,包括了vue异步axios获取的数据渲染到页面的方法的使用技巧和注意事项,需要的朋友参考一下 我们在vue,数据很多事异步获取来的,如果在template直接使用,会报错,undefined。 因为先渲染后得到的数据,那如何才能不报错呢? computed!!! 举个例子 index.vue 忽略坑人的传参方式。。。 在创建时获取数据,

  • 问题内容: 发生更改时,如何检测对数据库的最新更新并以静默方式刷新页面? 假设数据库访问如下所示: 任何想法和样品将不胜感激。谢谢。 问题答案: 这就是我最近使用jQuery实现解决方案的方式。 每当发生 重大 更新时,PHP都会在数据库中增加一个字段。 最初加载页面时,使用数据库中的数字填充JavaScript变量: