weixin_44204580-CSDN博客

原创 vue渲染字符串形式的组件标签

// Mycomponent 子组件<template> <div>{{title}}</div></template><script>export default { props: { title: String }};</script>// 父组件<template> <myComp :html="html"></myComp></templa

2020-07-21 11:07:22 1106

原创公告通知栏无缝滚动

<div class="notice"> <div class="inner"> <span>麻烦给我的爱人来一杯Mojito 我喜欢阅读她微醺时的眼眸而我的咖啡糖不用太多这世界已经因为她甜得过头没有跟她笑容一样浓郁的雪茄</span> <span>麻烦给我的爱人来一杯Mojito 我喜欢阅读她微醺时的眼眸而我的咖啡糖不用太多这世界已经因为她甜得过头没有跟她笑容一样浓郁的雪茄</span>

2020-06-19 17:27:17 334

原创图片瀑布流

<template> <div class="wrap"> <div class="column"> <img :src="item" alt="" v-for="(item, index) in leftColumn" :key="index"> </div> <div class="column"> <img :src="item" alt="" v-for="(item,

2020-06-19 16:43:42 139

原创弹窗固定定位引起的滚动穿透

弹窗固定定位引起的滚动穿透如果直接给body添加固定定位，当出现滑动滚动条之后再出现弹窗这种情况时，页面会滚动到顶部，所以我们要记录滚动条的位置，无论是弹窗开启还是关闭都保证页面在滚动的位置 let scrollTop = 0; // 弹窗开启时调用 function forbidScroll() { scrollTop = document.documentElemen...

2019-07-10 10:45:55 640

原创关于打印

1.window.print()window.print();// 如果想要打印局部内容const currentHtml = document.body.innerHTML; //获取当前页面document.body.innerHTML = document.getElementById('print').innerHTML; //设置当前页面内容为需要打印的内容window.pri...

2019-05-28 17:51:07 158

原创使用WebAudio实现音频可视化（音波）

第一种：没有audio标签，利用AudioContext生成。 AudioContext是Web Audio API的核心对象。1.创建audiocontex，canvas (第一种和第二种都需要创建这些东东)const myCanvas = document.getElementById('myCanvas');const canvasCtx = myCanvas.getContext...

2019-05-11 17:02:28 11076 1

原创 axios的一些使用

axios的一些使用1. axios的作用 1.从浏览器中创建XMLHttpRequests 2.从node.js中创建http请求 3.支持PromiseAPI 4.拦截请求和响应 5.转换请求数据和响应数据 6.取消请求 7.自动转换JSON数据2.axios的使用封装axios// 使用post请求，发送的是formdata格...

2019-04-02 14:51:07 104

原创图片预加载

图片预加载封装(function() { function isArray(arr) { return Object.prototype.toString.call(arr) === "[object Array]" // 判断是不是数组 } var imgLoader = function(imgArr, cb, time) { time = t...

2019-03-26 16:12:29 97

原创保存canvas图标到本地

保存canvas图标到本地this.saveImage.onclick = () => {// 1.获取canvas元素 const canvas = document.querySelector('canvas') // 2. 参数 {type：图片格式， encoderOptions：图片质量} 返回包含图片展示的dataURl 格式： data:[<mediat...

2019-03-20 16:13:40 125

formData的使用FormData对象用以将数据编译成键值对，以便用XMLHttpRequest来发送数据。其主要用于发送表单数据，但亦可用于发送带键数据(keyed data)，而独立于表单使用。如果表单enctype属性设为multipart/form-data ，则会使用表单的submit()方法来发送数据，从而，发送数据具有同样形式。1.通过HTML表单创建FormData对象可...

2019-03-20 15:49:57 332

原创时间格式化

1. 时间戳与标准日期转化export function formatTime (time, format) { let t = new Date(time) let o = { 'M+': t.getMonth() + 1, // month 'd+': t.getDate(), // day 'h+': t.getHours(), // hour 'm+': t.get...

2019-03-13 18:44:41 117

原创 vue中$emit的使用进行父子间数据传递

vue中$emit的使用进行父子间数据传递子组件&lt;template&gt; &lt;div class="child"&gt; 我是子组件 &lt;button @click="send"&gt;点击我向父组件传递数据&lt;/button&gt; &lt;/d

2019-03-01 14:26:12 262

原创移动端IOS横向滑动卡顿处理

移动端IOS横向滑动卡顿处理横向滑动采用overflow-x: auto/scroll;并隐藏滚动条的形式，但是这种做法Android支持，IOS会出现滑动卡顿的现象，因此可以在之前的基础上添加-webkit-overflow-scrolling: touch，这样就不会有卡顿现象，但是这个解决后，隐藏滚动条又没了作用，所以可以通过再添加一层div，然后把内层的div用padding撑开，外层d...

2019-01-23 17:07:03 898

原创 gulp4.0基本配置

gulp4.0基本配置刚开始按照3.0版本，定义task任务后，返回一个流，但是一直报错The following tasks did not complete: xxxxxDid you forget to signal async completion所以就去百度了一下，里面给了好几种解决方案，我用的是async 与await结合，3.0版本中的好多插件在4.0中不能使，下面是我做...

2018-12-27 16:49:50 1360

原创一个页面中有多个视频播放

单页面中多个video标签前几天做了一个项目，一个页面中有六个video标签，视频自动播放，需要联播。一开始使用点击事件click，点击非控件可行，能够实现上述功能，但是当点击控件比如播放按钮的时候，视频就重叠了，后来才得知可以使用onplay事件vue项目<div class="img" @click="videoPlay(index)"> <video :src="...

2018-12-24 11:45:25 4829 2

原创点击事件绑定累加

点击事件绑定累加当我们使用构造函数的实例对象来注册页面的点击事件，需要在init初始函数中或者构造函数中调用，如果是在实例对象的点击事件方法中调用，会出现点击事件累加的效果，即是：点击一次，触发多次比如：下面的有两个页面，初始显示第一个粉色页面，点击粉色页面的按钮显示第二个黄绿色页面，再次点击第二个页面的按钮显示，第一个页面，这样的页面效果中有两次点击事件，如果我们将他们注册到实例对象中，需...

2018-12-24 11:24:58 350

weixin_44204580的博客