vue中jsonp插件的使用方法示例


Posted in Javascript onSeptember 10, 2020

通过jsonp简单获取接口数据,对了,注意下jsonp方法会自动添加callback

<template>
	<div class="sky">
		<h3>获取城市:</h3>
		<div class="skycon"></div>
	</div>
</template>

<script>
//导入jsonp插件
import jsonp from 'jsonp';

export default{
	data(){
		return {
			
		}
	},
	created(){
		//jsonp请求数据
		this.getLocation()
	},
	methods:{
		getLocation(){
			let url = "https://apis.map.qq.com/ws/location/v1/ip?key=CAABZ-AVSAQ-RDR5L-GTBDJ-HLA4O-A5FDB&output=jsonp&_=1599182599164"
			//jsonp方法会自动添加callback
			jsonp(url,{},(err,data)=>{
				//url地址 //{}参数 //(err,data)错误信息,获取的数据
				console.log(data)
			})
		}
	}
}
</script>

<style>
</style>

总结

到此这篇关于vue中jsonp插件的使用的文章就介绍到这了,更多相关vue中jsonp插件使用内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
ExtJS 2.0 实用简明教程之布局概述
Apr 29 Javascript
使用Jquery Aajx访问WCF服务(GET、POST、PUT、DELETE)
Mar 16 Javascript
浅谈Javascript事件模拟
Jun 27 Javascript
javascript在myeclipse中报错的解决方法
Oct 29 Javascript
jQuery xml字符串的解析、读取及查找方法
Mar 01 Javascript
三种Node.js写文件的方式
Mar 08 Javascript
Bootstrap学习笔记之css组件(3)
Jun 07 Javascript
解析利用javascript如何判断一个数为素数
Dec 08 Javascript
JS使用贪心算法解决找零问题示例
Nov 27 Javascript
使用JavaScript解析URL的方法示例
Mar 01 Javascript
通过实例了解Javascript柯里化流程
Mar 03 Javascript
SpringBoot在yml配置文件中配置druid的操作
Nov 16 Javascript
vue 实现一个简单的全局调用弹窗案例
Sep 10 #Javascript
vue v-for 点击当前行,获取当前行数据及event当前事件对象的操作
Sep 10 #Javascript
vue 使用lodash实现对象数组深拷贝操作
Sep 10 #Javascript
Vue 按照创建时间和当前时间显示操作(刚刚,几小时前,几天前)
Sep 10 #Javascript
vue 导出文件,携带请求头token操作
Sep 10 #Javascript
vue radio单选框,获取当前项(每一项)的value值操作
Sep 10 #Javascript
jquery实现简单每周轮换的日历
Sep 10 #jQuery
You might like
php数据库连接
2006/10/09 PHP
php中显示数组与对象的实现代码
2011/04/18 PHP
php格式化日期和时间格式化示例分享
2014/02/24 PHP
jQuery取id有.的值的方法
2014/05/21 Javascript
Javascript实现单例模式
2016/01/24 Javascript
JQuery Mobile实现导航栏和页脚
2016/03/09 Javascript
使用js获取地址栏参数的方法推荐(超级简单)
2016/06/14 Javascript
详解webpack+express多页站点开发
2017/12/22 Javascript
10行代码实现微信小程序滑动tab切换
2018/12/28 Javascript
非常实用的jQuery代码段集锦【检测浏览器、滚动、复制、淡入淡出等】
2019/08/08 jQuery
layui 表格操作列按钮动态显示的实现方法
2019/09/06 Javascript
jquery实现商品sku多属性选择功能(商品详情页)
2019/12/20 jQuery
vue数据响应式原理知识点总结
2020/02/16 Javascript
python基于windows平台锁定键盘输入的方法
2015/03/05 Python
详解Python的Flask框架中生成SECRET_KEY密钥的方法
2016/06/07 Python
python requests 库请求带有文件参数的接口实例
2019/01/03 Python
python实现整数的二进制循环移位
2019/03/08 Python
Django Form 实时从数据库中获取数据的操作方法
2019/07/25 Python
基于Django框架的权限组件rbac实例讲解
2019/08/31 Python
Flask框架搭建虚拟环境的步骤分析
2019/12/21 Python
Python统计学一数据的概括性度量详解
2020/03/03 Python
屏蔽Django admin界面添加按钮的操作
2020/03/11 Python
Python requests及aiohttp速度对比代码实例
2020/07/16 Python
python爬虫---requests库的用法详解
2020/09/28 Python
西尔斯百货官网:Sears
2016/09/06 全球购物
Nuts.com:优质散装,批发坚果、干果和巧克力等
2017/03/21 全球购物
英国标志性生活方式品牌:Skinnydip London
2019/12/15 全球购物
个人找工作自荐信格式
2013/09/21 职场文书
高中生的学习总结自我鉴定
2013/10/26 职场文书
实习生评语
2014/04/26 职场文书
教导主任竞聘演讲稿
2014/05/16 职场文书
劳动保障个人工作总结
2015/03/04 职场文书
安全生产培训心得体会
2016/01/18 职场文书
助学金申请书该怎么写?
2019/07/16 职场文书
历史名人教你十五个读书方法,赶快Get起来!
2019/07/18 职场文书
redis 限制内存使用大小的实现
2021/05/08 Redis