vue中本身没有ajax功能,需要使用扩展,现在推荐使用的是axios,github地址如下

https://github.com/axios/axios

下面各个示例

<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title>vue axios使用</title>
<script type="text/javascript" src="{$Think.config.xinxi}/vue.js"></script>
<script type="text/javascript" src="{$Think.config.xinxi}/axios.min.js"></script>
</head> <body>
<div id="app"></div>
<script>
var test=new Vue({
el:"#app",
data:{ },
methods:{ send:function(){ axios({
method: 'get',
url: 'http://127.0.0.1/xinxi/public/index.php/index/index/szxx'
})
.then(function (response) {
console.log(response)
})
.catch(function (error) {
console.log(error)
}) }
}
});
</script> </body>
</html>

在本地打开进行ajax访问会有跨域问题,会导致无法访问,跨域问题的解决可以参考这篇文章:https://blog.csdn.net/qq_36575992/article/details/80338538

file:///C:/Users/Administrator/Desktop/vue/index.html

所以我是在本地服务器使用访问的http://127.0.0.1/xinxi/public/index.php/index/index/axios

vue2中使用ajax的更多相关文章

  1. vue - Vue中的ajax

    只有在ajax才能找回一点点主场了,vue中的ajax一天整完,内容还行,主要是对axios的运用. 明天按理说要开始vuex了,这个从来都是只耳闻没有眼见过,明天来看看看看是个什么神奇的东西. 一. ...

  2. Jquery中的Ajax

    AJAX: * jQuery中的Ajax * 封装第一层 - 类似于原生Ajax的用法 * $.ajax() - 最复杂 * 选项 * url - 请求地址 * type - 请求类型,默认为GET ...

  3. jQuery入门(4)jQuery中的Ajax应用

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  4. 【Java EE 学习 33 上】【JQuery样式操作】【JQuery中的Ajax操作】【JQuery中的XML操作】

    一.JQuery中样式的操作 1.给id=mover的div采用属性增加样式.one $("#b1").click(function(){ $("#mover" ...

  5. PHP--------TP中的ajax请求

    PHP--------TP中的ajax请求 以jQuery中的ajax为例: (1)引入jQuery 通过模板替换表示路径,我们可以自定义模板替换变量(在config中定义) /*自定义模板替换标签* ...

  6. jquery中的ajax参数

    jquery中将ajax封装成了函数,我们使用起来非常方便,jquery会自动根据内容选择post还是get方式提交数据,并且会自动编码,但是要想完全掌握jquery中的ajax,我们必须将它的各个参 ...

  7. 如何在Vue2中实现组件props双向绑定

    Vue学习笔记-3 前言 Vue 2.x相比较Vue 1.x而言,升级变化除了实现了Virtual-Dom以外,给使用者最大不适就是移除的组件的props的双向绑定功能. 以往在Vue1.x中利用pr ...

  8. javascrpt 中的Ajax请求

    回顾下javascript中的Ajax请求,写一个小例子: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...

  9. 项目中关于ajax jsonp的使用

    项目中关于ajax jsonp的使用,出现了问题:可以成功获得请求结果,但没有执行success方法总算搞定了,记录一下 function TestAjax() {    $.ajax({       ...

随机推荐

  1. linux命令学习笔记(14):head 命令

    head 与 tail 就像它的名字一样的浅显易懂,它是用来显示开头或结尾某个数量的文字区块,head 用来显 示档案的开头至标准输出中,而 tail 想当然尔就是看档案的结尾. .命令格式: hea ...

  2. ACM学习历程—HDU5422 Rikka with Graph(贪心)

    Problem Description As we know, Rikka is poor at math. Yuta is worrying about this situation, so he ...

  3. bzoj 3881: [Coci2015]Divljak AC自动机

    题目大意: http://www.lydsy.com/JudgeOnline/problem.php?id=3881 题解: 这道题我想出了三种做法,不过只有最后一种能过. 第一种: 首先我们把所有的 ...

  4. bzoj 3689: 异或之 Trie+堆

    题目大意: http://www.lydsy.com/JudgeOnline/problem.php?id=3689 题解: 利用一个优先队列存储当前取到的数 然后再写一颗支持查找异或的k大值的Tri ...

  5. 使用 Anthem.NET 的经验小结

    1. 不依靠 Panel 来做省事的区域性 Ajax. 2. 控件不要图偷懒设置 AutoUpdateAfterCallBack = true. 而是每次需要更新的时候指定 UpdateAfterCa ...

  6. python中string和bool的转换

    python中字符串"True" 和 "False"转为bool类型时, 不能通过bool(xx)强转. 注意是因为在python中,除了&apos;& ...

  7. JS 获取json长度

    var keleyijson={"plug1":"myslider","plug2":"zonemenu"," ...

  8. Trie(前缀树/字典树)及其应用

    Trie,又经常叫前缀树,字典树等等.它有很多变种,如后缀树,Radix Tree/Trie,PATRICIA tree,以及bitwise版本的crit-bit tree.当然很多名字的意义其实有交 ...

  9. 电脑当路由使用(目前只在win7上用过)

    前提:电脑有无线网卡,并打开了无线 第一步使用管理员权限运行cmd.exe 1.执行如下命令 netsh wlan set hostednetwork mode=allow ssid=myWifi k ...

  10. CCNet说明文档

    1.CCNet安装步骤 1)    安装CCNet服务器端:CruiseControl.NET-1.8.5.0-Setup.exe 2)    安装CCNet客户端:CruiseControl.NET ...