JS中iframe子页面与父页面之间通信
JS中iframe子页面与父页面之间通信 iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同 原文:https://www.cnblogs.com/wxlevel/p/7646943.html 一、同域下父子页面的通信父页面parent.html1234567891011121314151617<html><head> <script type="text/javascript"> function say(){ alert("parent.html"); } function callChild(){ myFrame.window.say(); myFrame.window.document.getElementById("button").value="调用结束"; ...
vue .sync修饰符用法
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152<!DOCTYPE html><html lang="zh-cn"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <link rel="stylesheet" type="text/css" href="./fontFace.css"> <script src="../vue2.6.js"></script></head><body> <div id=...
vue-props
1.v-bind 是用来绑定属性的和 props 传递对象或值使用的「props 默认传递的是字符串,如果想要传值、对象,那么就要使用 v-bind」 2.如果 props 中声明的是数据是驼峰标识,那么传值的时候就要使用 - 标识 3.如:props 中的数据是 myData 那么在组件中传值时就要使用 my-data="" ,如果没有使用驼峰那不牵扯 4.props 用来定义一些默认值,我们不能直接修改 props 的值,只能通过 data 来间接修改 5.要写一个"合格"的 vue 组件,那么 props 最好加上验证 6.props 也可以用来传递方法,达到父组件调用子组件方法并且回调的目标 7.vue 中的方法建议写在 methods 中,无参方法调用时就不要加括号 链接:https://www.jianshu.com/p/87ff57037d9c
vue添加全局方法属性
在使用vue构建一些大型项目的时候,会发现许多组件会共用到一些函数或常量,我们需要把它提取出来,每次需要的时候调用一次就可以了,避免每个组件都重新写再一篇的麻烦。这就需要写一个插件,在Vue.prototype上挂载我们需要的全局方法属性,比如Vue.prototype.const={}就是项目中的常量,Vue.prototype.utils={}就是项目的方法。下面就详细介绍下基于vue-cli的架子如何开发。 方法一1、新建插件文件Plugins.js:12345678910111213141516171819202122232425262728293031323334353637383940export default{ install(Vue){ // 形式一 Vue.prototype.$const={//常量 URL:"http://www.fly63.com/",//项目请求接口的url } Vue.prototype....
vue-computed
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869<html> <head> <script src="https://jsd.012700.xyz/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> computed属性计算 <div> val3: {{ val3 }} </div> <div> val4: ...
vue-methods
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061<html> <head> <script src="https://jsd.012700.xyz/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> methods <div> test1(): {{ test1() }} {{ test2() }} {{ test3() ...
vue-watch
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081<html> <head> <script src="https://jsd.012700.xyz/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> 实际开发中,watch会随着组件一并销毁。 </div> </body> <script> var app = new Vue({ el: '#app', data: ...
Vue-cli3搭建一个Vue项目
Vue-cli3搭建一个Vue项目1、下载安装Node.js下载地址:https://nodejs.org/en/download/ ,选择合适自己的版本下载即可。 安装Node.js会默认安装npm(包管理工具) 2、安装vue-cli3脚手架如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g卸载它。 12npm install -g @vue/cli# vue --version 3、创建项目1234# vue create --helpvue create hello-world# 图形界面vue ui 4.运行项目1npm run serve 5.编译项目1npm run build
Vue实例中data属性的三种写法及区别
Vue实例中data属性的三种写法及区别 1、第一种 12345678<script type="text/javascript"> var app=new Vue({ el:'#app', data:{ isLogin: false } })</script> 2、第二种 12345678910<script type="text/javascript"> var app=new Vue({ el:'#app', data: function(){ return { isLogin: false } } })</script> 3、第...
Vue最简单例子
IDE:HBuilderX Vue最简单例子html1234567891011121314<html> <head> <link rel="stylesheet" href="index.css"> <script src="https://jsd.012700.xyz/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> {{ message }} </div> <script src="index.js"></script> </body></html> css123...
vue后台模板
d2admind2admin官方文档https://doc.d2admin.fairyever.com/zh/ d2admin源码https://github.com/d2-projects/d2-admin beego + d2adminhttps://github.com/Qsnh/goa 1234567git clone https://github.com/d2-projects/d2-admin.gitcd d2-adminnpm installnpm run dev vue-element-adminhttps://github.com/PanJiaChen/vue-element-admin https://panjiachen.github.io/vue-admin-template/ 精简版 https://github.com/dongdong-cloud/dd-admin [*] vue antdhttps://github.com/vue-alain/vue-alain https://github.com/sendya/ant-design-pro-...
Vue-cli webpack配置分析
Vue-cli webpack配置分析分析不包括check-versions.js文件,因为check-versions.js是检测npm和node版本,不涉及webpack,所以就没有对check-versions.js进行分析。同时,也不包括测试部分的代码,该分析只是针对开发和生产环境的webpack配置进行分析。 vue-cli 版本2.8.1 入口从package.json可以看到开发和生产环境的入口。 1234"scripts": { "dev": "node build/dev-server.js", "build": "node build/build.js"} 开发环境开发环境的入口文件是 build/dev-server.js。 dev-server.js该文件中,使用express作为后端框架,结合一些关于webpack的中间件,搭建了一个开发环境。 123456789101112131415161718192021...
Vue-cli搭建一个Vue项目
Vue-cli搭建一个Vue项目1、下载安装Node.js下载地址:https://nodejs.org/en/download/ ,选择合适自己的版本下载即可。 安装Node.js会默认安装npm(包管理工具) 2、安装vue-cli脚手架① 使用npm(需要安装node环境)全局安装webpack 123npm install -g webpacknpm install -g webpack-cliwebpack -v ② 全局安装vue-cli,在cmd中输入命令: 1npm install --global vue-cli 3、创建项目1vue init webpack test 项目配置选择 Project name (test):项目名称,直接回车,按照括号中默认名字,注意这里的名字不能有大写字母,如果有会报错Sorry, name can no longer contain capital letters),阮一峰老师博客为什么文件名要小写 ,可以参考一下。 Project description (A Vue.js project): 项目描述,也可直...
前端vue
VUE资源汇总:https://github.com/vuejs/awesome-vue https://github.com/opendigg/awesome-github-vue 中文 基于vue的库https://cn.vuejs.org/ vue官方中文网站 https://panjiachen.github.io/vue-element-admin-site/zh/ vue后台框架(github)https://gitee.com/liuyuantao/vue-element-admin vue后台框架(gitee) https://element.eleme.cn/#/zh-CN 基于Vue2.0的桌面端组件库 https://iviewui.com/ Vue UI组件库 https://at-ui.github.io/at-ui/#/zh Vue UI组件库 https://vuetifyjs.com/zh-Hans/ Vue UI组件库 https://dafrok.github.io/vue-baidu-map/#/zh/index Vue2.x的百度地图组件...
ab压力测试
ab压力测试1. ab工具下载windows:https://www.apachehaus.com/cgi-bin/download.plx 2. ab参数说明有关 ab 命令的使用,我们可以通过帮助命令进行查看。如下: 123456789101112131415161718192021222324252627282930313233343536373839404142$ ./ab.exeC:\Users\Windows10\Desktop\Apache24\bin\ab.exe: wrong number of argumentsUsage: C:\Users\Windows10\Desktop\Apache24\bin\ab.exe [options] [http://]hostname[:port]/pathOptions are: -n requests Number of requests to perform -c concurrency Number of multiple requests to make at a time -t t...
hey压力测试
hey压力测试1. hey工具下载https://github.com/rakyll/hey 2. hey参数说明有关hey命令的使用,我们可以通过帮助命令进行查看。如下: 12345678910111213141516171819202122232425262728293031323334Usage: hey [options...] <url>Options: -n Number of requests to run. Default is 200. -c Number of workers to run concurrently. Total number of requests cannot be smaller than the concurrency level. Default is 50. -q Rate limit, in queries per second (QPS) per worker. Default is no rate limit. -z Duration of application to send req...
搭建个人博客
ubuntu 16.04 x64 mysql5.7 php7.0 apache2 阿里云服务器首先要sudo apt update 1.安装MySql安装的版本最好是5.7+ 1sudo apt-get install mysql-server 123456789101112131415161718192021#方法1:用SET PASSWORD命令mysql> set password for root@localhost = password('123');#方法2:用mysqladminmysqladmin -uroot -p123456 password 123#方法3:用UPDATE直接编辑user表#对于5.7以下版本:mysql> use mysql;mysql> update user set password=password('123') where user='root' and host='localhost';mysql> flush priv...
YAML教程
YAML 语言教程一、简介YAML 语言(发音 /ˈjæməl/ )的设计目标,就是方便人类读写。它实质上是一种通用的数据串行化格式。 它的基本语法规则如下。 大小写敏感 使用缩进表示层级关系 缩进时不允许使用Tab键,只允许使用空格。 缩进的空格数目不重要,只要相同层级的元素左侧对齐即可 #表示注释,从这个字符一直到行尾,都会被解析器忽略。 YAML 支持的数据结构有三种。 对象:键值对的集合,又称为映射(mapping)/ 哈希(hashes) / 字典(dictionary) 数组:一组按次序排列的值,又称为序列(sequence) / 列表(list) 纯量(scalars):单个的、不可再分的值 以下分别介绍这三种数据结构。 二、对象对象的一组键值对,使用冒号结构表示。 1animal: pets 转为 JavaScript 如下。 1{ animal: 'pets' } Yaml 也允许另一种写法,将所有键值对写成一个行内对象。 1hash: { name...
TOML教程
TOML v0.5.0全称: Tom的(语义)明显、(配置)最小化的语言。 (Tom's Obvious, Minimal Language. By Tom Preston-Werner.) 注: 此规范仍然会发生很多变化。在未标记为1.0之前,你应该假设它是不稳定的,请酌情采用。 目标TOML的目标是成为一个有明显语义而容易去阅读的最小化配置文件格式。 TOML被设计成可以无歧义地被映射为哈希表,从而很容易的被解析成各种语言中的数据结构。 示例123456789101112131415161718192021222324252627282930313233# 这是TOML文档示例.title = "TOML Example"[owner]name = "Lance Uppercut"dob = 1979-05-27T07:32:00-08:00 # 时间日期当然是一等公民了。[database]server = "192.168.1.1"ports = [ 8001, 8001, 8002 ]connecti...
帧率(FPS)计算的六种方法总结
帧率(FPS)计算的六种方法总结帧率(FPS)计算是游戏编程中常见的一个话题。大体来说,总共有如下六种方法: 一、固定时间帧数法帧率计算的公式为: 1fps = frameNum / elapsedTime; 如果记录固定时间内的帧数,就可以计算出同步率。此种方法用得较多。 1234567891011121314151617int fps(){ static int fps = 0; static int lastTime = getTime(); // ms static int frameCount = 0; ++frameCount; int curTime = getTime(); if (curTime - lastTime > 1000) // 取固定时间间隔为1秒 { fps = frameCount; frameCount = 0; lastTime = curTime; } return fps;} 还有另一种写法:...