在vue中使用天气插件
在vue中使用天气插件
插件网址: 中国天气
选择自己需要的插件、生成代码复制即可
在 vue 中的使用:
template 中
<div id="weather-v2-plugin-simple"></div>
mounted 中
window.WIDGET = {CONFIG:{"modules":"20","background":5,"tmpColor":"ffffff","tmpSize":16,"cityColor":"ffffff","citySize":16,"aqiSize":16,"weatherIconSize":24,"alertIconSize":18,"padding":"10px 10px 10px 10px","shadow":"1","language":"auto","borderRadius":5,"fixed":"false","vertical":"middle","horizontal":"center","key":"aGh9gAMF5m"}}
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://apip.weatherdt.com/simple/static/js/weather-simple-common.js?v=2.0';
document.getElementsByTagName('head')[0].appendChild(script);
在vue中使用天气插件的更多相关文章
- vue中使用第三方插件animate.css实现动画效果
vue中使用第三方插件animate.css实现动画效果1.首先先引入第三方类animated.css2.将你所需要动画的标签用包裹起来3.在transition元素中添加enter-active-c ...
- Vue中的better-scroll插件
Vue中的better-scroll插件 在需要的文件中添加 import BScorll from 'better-scroll'; 引用的示例代码: let scroll = new BScrol ...
- vue中使用video插件vue-video-player
一.安装插件 npm install vue-video-player --save 二.配置插件 在main.js中全局配置插件 import VideoPlayer from 'vue-video ...
- vue中使用vue-pdf插件显示pdf
最近项目需求需要在vue中展示pdf,上网搜索了实现方法,找到vue-pdf这个插件非常好用,并且还有许多方法.属性能进行功能扩展. 一.安装 npm install --save vue-pdf 二 ...
- vue中如何开发插件
1.vue中提供了install方法用来开发插件 官方:Vue.js 的插件应该有一个公开方法 install.这个方法的第一个参数是 Vue 构造器,第二个参数是一个可选的选项对象. 2.我的插件目 ...
- react 或 vue 中引用 jQuery 插件
前言 今天与遇到一个令人抓狂的事情, 因为项目中有个交互太过于复杂而且冷门, 没有人封装类似react-swiper那种的移植过来的插件 只有现成的jQuery插件. 而时间并不宽裕,自己重写成rea ...
- vue中引入swiper插件
这里我们使用npm的方式安装swiper插件. 1.npm install vue-awesome-swiper --save 2.在main.js文件中引入文件 import Vue from 'v ...
- Vue中 axios+QS 插件往后台传参
之前用Vue+element写了一个后台管理系统,在登录时使用axios请求数据传参时无法正常的获取数据.发现原因是传递参数要将参数序列化.这里使用了qs插件: 简单来说,qs 是一个增加了一些安全性 ...
- vue中使用jquery插件
(1)使用npm下载安装依赖 直接npm install ‘插件名称’ --save 安装依赖 在main.js中引入插件的样式 在页面中直接使用 (2)直接将js文件引入到项目中 先将js文 ...
随机推荐
- IdentityServer4网页(单点)登陆入门
前言 本篇说说ids中的网页登陆以及单点登陆的大致原理,主要是以基本跑通为目的,下一篇开始会详细说明集成ids网页登陆原理. 最好先熟悉以下知识: asp.net core asp.net core的 ...
- SLS案例中心
今日PV nginx日志查看今日的PV和昨日的对比,先通过count函数计算总的pv,再用compare函数得出今日的pv和昨日的同比. 通过单值图进行展示,显示值为20.381Mil,对比值为-2% ...
- 查看/设置 mysql时区
# 查看时区 show variables like '%time_zone%'; # 设置全局 set global time_zone='+8:00'; # 设置当前会话 set time_zo ...
- GA教程:使用自定义变量来扩展高级细分
http://www.wocaoseo.com/thread-64-1-1.html 您可以使用自定义变量来扩展高级细分的范围. 高级细分依据的标准是用户的会话(访问)数据.如果某个访问者在指定日期范 ...
- 【Go语言探险】线上奇怪日志问题的排查
最近在日志中发现一些奇怪的日志,大致长这样: Error 2020-08-28 06:59:38.813+00:00 ... _msg=get immersion context, fetch tra ...
- 解决Oracle12cr2自创建用户无法登录的问题
说明: 下面创建是创建CDB本地用户,不是PDB应用程序用户,如果是PDB应用程序创建语法会不一样.下面介绍创建CDB本地用户. 创建表空空间 CREATE TABLESPACE YH datafil ...
- Linux下Vim常用操作
linux下Vim的常用操作 linux 首先\(ctrl+Alt+t\)打开小框框 \(./\):相当于手机上的\(home\)键 \(ls\):当前文件夹的东东 \(mkdir\) ...
- Spring源码分析 手写简单IOC容器
Spring的两大特性就是IOC和AOP. IOC Container,控制反转容器,通过读取配置文件或注解,将对象封装成Bean存入IOC容器待用,程序需要时再从容器中取,实现控制权由程序员向程序的 ...
- 【python】迭代器与生成器到底是什么?看完你就知道
迭代器跟生成器,与上篇文章讲的装饰器一样,都是属于我的一个老大难问题. 通常就是遇到的时候就去搜一下,结果在一大坨各种介绍博客中看了看,回头又忘记了. 你是不是也是这样呢? 俗话说:好记性不如烂笔头, ...
- vue <compent> 结合is实现动态切换子组件
这里就很自然的产生一个新问题:如何给相应的子组件传props?