之前本来想不写这个功能的,结果客户死活要qq登录! 实在没办法就写了,顺便写个文章!在写之前有两个问题:1: 打开qq授权页面点击页面中的链接会又打开一个页面! ..... 2: 授权之后是否成功很难去判断 不过脑海中有一个想法就是,electron就是一个类似于浏览器一样,既然是浏览器那肯定可以阻止链接的点击 也可以判断状态! 就去啃文档了!!! 推荐大家去w3c去看文档 比较全 而且速度较快 文档也比较新:https://www.w3cschool.cn/electronma...
最近有一个场景是Child2组件点击让Child1组件里面的state的值发生改变,Child1是一个公用组件,把里面的state值改为props传递,修改内容太多,容易出错,就想找其他的方法来解决兄弟组件调用方法问题,下面看代码: Child1 是第一个子组件class Child1 extends React.Component {constructor(props) {super(props);this.state = {text:Child1};}onChange=()=>{this.setState({text:Child1 onChange})}componentDidMount(){this.props...
简介页面中用 clipboard 可以进行复制粘贴,clipboard能将内容直接写入剪切板 安装npm install --save clipboard使用方法一<template><span>{{ code }}</span><iclass="el-icon-document"title="点击复制"@click="copyActiveCode($event,code )"/> </template> // methods copyActiveCode(e, text) {const clipboard = new Clipboard(e.target, { text: () => text })clipboard.on(success, e => {this.$message({ type: success, ...
前言 最近组长安排着做一个项目,h5的应用下载项目,想着做起来还是比较容易,可是看到提出的需求,我就有点懵逼了!需要对应用的下载进行统计!!!我当时就想着我前端怎么对页面点击按钮就行数据统计啊!我以前的项目也有对应用的下载量就行数据统计的,可是那些项目都是后台人员编写进行数据统计的。我当时就有点不知所措了。想着怎么进行统计,怎么搞定这个!百度得知,百度统计可以帮着解决这个问题,可是没有用过啊!硬着头皮...
1、安装使用npm下载: `npm install wangeditor`2、 创建实例(1)基本用法: <template><div><div id="editor" class="editor"></div></div> </template><script> import E from wangeditor export default {name: editor,mounted () {var editor = new E(#editor)editor.customConfig.onchange = (html) => {this.formArticle.content = html}editor.create()} } </script>效果如图(2)自定义高度写法如下:把菜单和编辑框分开 ...
前言本篇使用 NodeJS 的 HTTP 服务创建客户端,使用 Range 请求实现下载功能,并通过本篇的 Demo 扩展在业务中实现断点续传等功能的思路。 服务端的实现我们通过 http 模块创建服务器处理 Range 请求,在服务器代码中我们为了减少回调嵌套使用 async 函数,所以需要将异步的操作方法转换成 Promise,以往我们使用 util 的 promisify 来一个一个转换异步方法,比较麻烦,我们这次使用第三方模块 mz 并直接引入转换好的替代模块。 使...
Vue 通过直接强制刷新 DOM 来达到重置组件的效果,这样可以重置一些组件的动画以及组件内初始的数据强制重新生成 DOM 的实现原理:强制重新生成 DOM 可以通过 Vue 中的 key 来实现。在 Vue 更新 Dom 时,如果 key 值相同则会对原有组件进行复用,如果不同,则会重新生成。 代码示例: 每次点击 refresh 按钮,Demo 组件都会重新生成组件: /*** Demo.vue*/ <template><div>Demo</div> </template> <script>export default {data ()...
Sass(英文全称:Syntactically Awesome Stylesheets)是一个最初由Hampton Catlin设计并由Natalie Weizenbaum开发的层叠样式表语言。Sass是一个将脚本解析成CSS的脚本语言,即SassScript。Sass包括两套语法。最开始的语法叫做“缩进语法”,与Haml类似,使用缩进来区分代码块,并且用回车将不同规则分隔开。而较新的语法叫做“SCSS”,使用和CSS一样的块语法,即使用大括号将不同的规则分开,使用分号将具体的样式分开。通常情况下...
最近Vue项目中,要将用户上传的图片全部上传到oss上,OSS配置项请访问:https://help.aliyun.com/document_detail/64095.html?spm=a2c4g.11186623.6.773.kcD20n OSS平台配置在平台的概览里面看看自己的基础设置里面的读写权限是否改为了公共读,我这边只有配置公共读才上传并且回显图片成功,其他情况还请朋友告知,谢谢关于跨域访问的配置这里是我的效果图 (当只有点击上传按钮时才会上传到OSS)预览图片<template><div class="v...
在React搭建的SPA项目中页面的title是直接写在入口index.html中,当路由在切换不用页面时,title是不会动态变化的。那么怎么让title随着路由的切换动态变化呢?1.在定义路由时增加title属性。{path: "/regularinvestment",component: Loadable({loader: () => import(./../../business/Regularinvestment/index),loading: PageLoading}),title: "这是自定义的标题"} 2.在路由的index.js获取到自定义的title设置页面标题即可。const...
概述 后台管理系统里面有非常多的表单需求,我们希望能够通过写一个json格式的数据,通过vue的循环动态地去渲染动态表单。并且能够在外部得到渲染出来的表单的数据,可以对表单进行重置操作。我结合element ui的控件的下拉框,输入框,时间选择控件和vue-treeselect,做了一个动态表单。v-model的理解 先简单讲一下vue-model是怎么玩的。其实vue-model相当于给表单元素传递一个value,外部监听input事件。所以我们自己封装表单组件的...
代码敲完,项目上线,然后就要与优化相遇。项目有抢购的性质content download 时间非常的长加载慢的很,至此开始前端优化之旅 项目根目录运行 npm install webpack-bundle-analyzer --save-dev在build/webpack.dev.conf.js中引入 const BundleAnalyzerPlugin = require(webpack-bundle-analyzer).BundleAnalyzerPluginplugins: [new BundleAnalyzerPlugin()]运行后显示可以看到几个大的js 下面是已经优化过后的截图像vue ,vue-rou...
一、前言 在广告机项目中,角色的权限管理是卡了挺久的一个难点。首先我们确定的权限控制分为两大部分,其中根据粒的大小分的更细: 接口访问的权限控制页面的权限控制菜单中的页面是否能被访问页面中的按钮(增、删、改)的权限控制是否显示权限控制是什么 在权限的世界里服务端提供的一切都是资源,资源可以由请求方法+请求地址来描述,权限是对特定资源的访问许可,所谓权限控制,也就是确保用户只能访问到被分配的资源。具体的...
下载swiper首先使用npm 或者cnpm下载swiper cnpm install swiper 引入swiperimport Swiper from ‘swiper; import ‘swiper/dist/css/swiper.min.css;使用swiper<div class="swiper-container"><div class="swiper-wrapper"><div class="swiper-slide"><img src="../../static/images/ad1.jpg" alt=""></div><div class="swiper-slide"><img src="../../static/images/ad2.jpg" alt=""></div><div class="swiper-slide"><img src=...
本文实例讲述了jQuery超简单遮罩层实现方法。分享给大家供大家参考,具体如下: 在开发中,为了避免二次提交,遮罩层的运用越来越普遍 看了很多代码,下面跟大家分享一下我认为最简单的遮罩层实现方式: 1.样式如下设置: CSS代码: <style type="text/css">.mask {position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #777;z-index: 1002; left: 0px;opacity:0.5; -moz-opacity:0.5;display:none;} </st...