夜空下的微笑-优快云博客

原创 VSCode

前端开发工具VSCode以其轻量且强大的代码编辑功能和丰富的插件生态系统独受前端工师的青睐。官网下载：https://code.visualstudio.com/导航栏 code-首选项-设置-设置各种属性适用插件：1.中文插件Chinese (Simplified) Language Pack for Visual Studio Codehttps://marketplace.visualstudio.com/items?it...

2021-06-29 17:26:53 264

原创 TypeScript

1、TypeScript 是一种给 JavaScript 添加特性的语言扩展。增加的功能包括：类型批注和编译时类型检查类型推断类型擦除接口枚举Mixin泛型编程名字空间元组Await以下功能是从 ECMA 2015 反向移植而来：类模块lambda 函数的箭头语法可选参数以及默认参数2、JavaScript 与 TypeScript 的区别a. TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的

2021-06-29 10:35:37 234

原创一个对象组成的数组中删除另一个数组存在的对象

由对象组成的数组对照删除一个表格，类似于下图，选中以后，做成纯前端批量删除arr2是全部的数据，arr1是勾选的数据let arr1 = [ { code: "123456781",color: "芭比粉"}, { code: "123456783",color: "芭比粉"}, { code: "123456785",color: "芭比粉"}]le...

2019-11-14 14:42:34 943

原创提示TypeError: this.cliEngine is not a constructor

点击details在控制台显示报错的位置TypeError: this.cliEngine is not a constructor at ESLintPlugin.invokeESLint (/Applications/RubyMine.app/Contents/plugins/JavaScriptLanguage/languageService/eslint/bin/esl...

2019-11-07 10:31:05 3846

原创 vue 导航菜单重新加载刷新页面

知识库项目点击导航菜单栏上点击子菜单刷新页面的需求应用vue在当前页面内路由参数发生变化，怎么进行页面刷新。传统方式window.location.reload(); 整个页面进行刷新，会出现白屏，体验不好this.$router.go(0); 同上，体验不友好推荐方法使用provide / inject组合方式原理：允许一个祖先组件向其子孙后代注入一个依赖，不论组件层次有...

2019-08-29 14:16:37 9863 2

转载在iview的表格render函数中给v-html赋值，table加载html标签问题解决方法

如果想要在表格渲染一个标签，尝试在render的props中放置v-html或者vHtml都不好用。错误写法：解决方案：勾选部分链接：https://www.jianshu.com/p/62b1305ca2d8...

2019-06-18 10:44:35 2830

原创 Chrome(谷歌浏览器）如何截屏整个页面不用插件

在页面空白处右键 --- 弹出菜单选择【检查】或者快捷方式ctrl+shift+i（fn+12）在elements下使用快捷方式ctrl+shift+p（command+shift+p），打开一个命令行输入框。然后输入screen,我们选择【Capture full size screenshot】，截图成功...

2019-06-13 10:48:46 5810

转载 Vue 组件之间互相通信

vm.$emit(event, [...args]) 触发当前实例上的事件，附加参数都会传给监听器回调。涉及到组件之间的通信的问题，组件之间的通信可以分为以下几种：父子组件传递，父向子传递采用 props，子向父采用事件 emit。非父子组件的传递，全局 event bus, 创建一个新的 vue 的实例，采用事件的方式通信，再者采用 vuex 全局状态管理。父子组件相互通信方法详情...

2019-06-05 15:25:59 202

原创 vue-router 动态路由传参 & 打开新窗口页面

一. 路由传参使用params方法传参的时候，要在路由后面加参数名，并且传参的时候，参数名要跟路由后面设置的参数名对应。使用query方法，就没有这种限制，直接在跳转里面用就可以。对比1: query方法，可以与path和name共用，params只能对应name。 query & params，前者在浏览器地址栏中显示参数...

2019-06-04 15:30:56 6269

转载 js中让字符串中特定字符红色显示

想要实现下图所示效果，纯js代码如下：<script type="text/javascript" language="javascript"> var s = "暖"; var reg = new RegExp("(" + s + ")", "g"); var str = "优快云暖枫无敌，暖枫无敌优快云"; var newstr =...

2019-05-30 17:10:36 5232

转载 zTree实现树形图模糊搜索

vue + ztree + iview改造ztree：项目地址：https://github.com/bigablecat/zTreeFuzzySearch1. 在搜索框中输入关键字,希望实现的效果:a). 树形图隐藏所有不匹配的节点b). 节点名称中匹配部分高亮2. 慢速演示:ztree_demo3. 完整代码和详细注释如下:a). html部...

2019-05-30 15:38:19 1062

转载 axure rp pro 9.0授权密钥

打开软件，可以看到是中文界面，点击enter license输入axure rp 9授权码。axure rp 9授权码：被授权人：www.ddooo.com授权秘钥：UdMLVdonmFlplbTMoBppfrUXZMhEQ6Mf2shBAkTCJBk5ycQJs2NALgvLsHhyfoYRaxure rp pro 9.0 Enterprise企业版：被授权人：www.ddooo.co...

2019-05-29 09:49:59 75566 8

转载 IDEA无法完整显示项目文件结构，Git文件后无法在项目中显示

1、我的项目结构里面不显示各个文件，但是点击目录，又能打开相应的文件：解决方法：file -> project structure -> Modules -> 绿色+加号+ -> import Modules 中添加目录项目文件。转载链接：https://blog.youkuaiyun.com/tg928600774/article/details/80894044...

2019-05-28 17:14:20 1240

原创 vue脚手架run dev之后自动启动浏览器

现在需要手动Alt+点击：http://localhost:8080config文件夹下index.js文件,里面有个dev方法，修改autoOpenBrowser状态为true

2019-05-28 16:54:30 540

原创 HTML5之title属性解决长文本显示不完全问题

<div class="ellipsis" title="${item.comment}">${item.comment}</div> 鼠标移上去全部显示<div class="ellipsis" title=${item.comment}>${item.comment}</div> 鼠标移上去部分显示...

2019-04-22 16:40:38 7063

转载字典值转换为数组对象结构

let objToList = (obj, code='code', value='value')=>{ const keys = Object.keys(obj) const result = keys.map(it=>{ return { [code]: it, [value]: obj[it] } }) return result...

2019-01-16 14:19:17 1161

转载 Vue.js v-model 指令的修饰符

1 .lazyv-model 指令默认会在 input 事件中加载输入框中的数据（中文输入法中输入拼音的过程除外）。我们可以使用 .lazy 懒加载修饰符，让其只在 change 事件中再加载输入框中的数据。<input type="text" v-model.lazy="content" placeholder="请输入" value="初始值"><p>输入框：{

2019-01-16 14:09:07 1268

原创字典值转换为数组对象结构

let objToList = (obj,code='code',value='value')=>{ const keys = Object.keys(obj) const result = keys.map(it=>{ return { [code]: it, [value]: obj[it] } }) return result}...

2018-11-26 12:06:08 5450

原创 vue-点击添加class 其他标签删除class

class && style 用法 <div id="app"> <grid :cols="2" style="margin: 0 -1px -1px;"> <grid-item class="reset-p" :class="{active: i == active}"

2018-11-15 13:02:24 2126

原创 Webpack devServer中的 proxy 实现跨域（用nodejs代理转发请求）

假设，我需要请求的接口的入口为 http://www.xxx.com/api，修改 /config/index.js 配置文件，修改 dev 选项下 proxyTable 的值为如下：你需要请求的接口的入口为 http://www.xxx.com/rest，而代码里请求的 url 写的是 '/api'，则你需要使用 pathRewrite 来进行路径重写，而不是直接改 traget...

2018-11-10 14:25:09 2957

原创 SpreadJS 表格控件相关基础知识

官方链接：https://www.grapecity.com.cn/developer/spreadjs总结：https://www.amoqi.cn/blog/detail/44帮助手册：http://help.grapecity.com.cn/pages/viewpage.action?pageId=5971410http://helpcentral.componentone.co...

2018-09-17 19:41:15 4552

转载 vue-cli 项目兼容ie浏览器的方法

问题描述ie11打开vue2.0项目空白,控制台报错 vuex requires a Promise polyfill in this browser；原因Babel 默认只转换新的 JavaScript 句法（syntax），而不转换新的 API ，比如 Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise 等全局对象，以及...

2018-09-03 11:10:50 1914

转载 webpack 如何使用 require.ensure() 进行代码拆分

require.ensure()webpack 在编译时，会静态地解析代码中的 require.ensure()，同时将模块添加到一个分开的 chunk 当中。这个新的 chunk 会被 webpack 通过 jsonp 来按需加载。语法如下：require.ensure(dependencies: String[], callback: function(require), chu...

2018-08-30 11:33:47 2053

转载 REACT生命周期

REACT生命周期：组件的生命周期可分成三个状态：Mounting：已插入真实 DOM Updating：正在被重新渲染 Unmounting：已移出真实 DOM生命周期的方法有： componentWillMount：在渲染前调用,在客户端也在服务端。 componentDidMount：在第一次渲染后调用，只在客户端。之后组件已经生成了对应的DOM结...

2018-08-29 16:09:25 453

原创判断浏览器类型

function getIsSafari() { let agent = navigator.userAgent.toLowerCase(); let regStrSaf = /safari\/[\d.]+/gi; // Safari if (agent.indexOf('safari') > 0 && agent.indexOf('chro...

2018-08-28 16:54:53 155

转载 less和sass有什么区别？

1.背景介绍预处理器：CSS预处理器是一种语言，用来为CSS增加一些编程的的特性，无需考虑浏览器的兼容性问题，例如你可以在CSS中使用变量、简单的程序逻辑、函数等等在编程语言中的一些基本技巧，可以让你的CSS更见简洁，适应性更强，代码更直观等诸多好处。我们最常用的预处理器有scss和less。 2.知识剖析sass背景Sass诞生于2007年，最早也是最成熟的一款...

2018-08-27 10:57:14 529

转载 react生命周期的基本用法

react组件构造:import React,{ Component } from 'react';class Demo extends Component { constructor(props,context) { super(props,context) this.state = { //定义state } }com...

2018-08-27 10:55:03 361

转载 React 生命周期方法执行顺序

调用super的原因：在ES6中，在子类的constructor中必须先调用super才能引用this super(props)的目的：在constructor中可以使用this.props 对于一个包含着生命周期的组件，有以下可选的生命周期方法： componentWillMount() 仅在render()方法前被调用一次，如果在该方法中调用了setState方法去...

2018-08-23 14:10:35 1863

转载 npm太慢，淘宝npm镜像使用方法

淘宝 npm 地址： http://npm.taobao.org/如何使用有很多方法来配置npm的registry地址，下面根据不同情境列出几种比较常用的方法。以淘宝npm镜像举例：1.临时使用npm --registry https://registry.npm.taobao.org install express12.持久使用npm config set re...

2018-08-23 10:13:37 154

转载前端轻量级web进度条 – Nprogress & nanobar

转载：http://www.xuanfengge.com/front-end-nprogress-and-lightweight-web-progress-bar-nanobar.html前言进度条库是前端中常见的库之一，bootstrap中提供了多种进度条样式。NProgress.js和nanobar.js是两款轻量级的进度条组件，使用简便。轩枫阁用过Nprogress，用于页面...

2018-08-22 11:03:41 816

原创 Element Input 输入框动态更改placeholder

<el-form-item label="申请说明：" prop="applyDesc"> <el-input type = "textarea" :maxlength = "500" :rows = "3" :placeholder = setPlaceholder(adminShow) @change = &qu

2018-08-06 17:05:48 7008

原创 Ajax请求

$.ajax({ url: ctx + "/castHome/getCastList", data: JSON.stringify(data), contentType: "application/json;charset=utf-8", processData: false, type: "POST", dataType: "JSON", ...

2018-08-02 18:05:43 166

原创底部跳转最顶层 & 禁止所有img拖动效果 & 事件委托 & 布局紊乱 & 效果 & 遮罩出现禁止移动 & setTimeout与setInterval

//底部跳转最顶层function JumpTop() { $('.goMoney').on('click',function () { var top = $('.cost').offset().top $(document.body).animate({scrollTop:top-60},500) }) $('.goTop').o...

2018-08-02 17:52:12 362

原创 Element 之 Steps 步骤条组件 simple 修改

简洁风格的步骤条设置simple可应用简洁风格，该条件下align-center/description/direction/space都将失效。针对该情况，将简单的步骤条修改为简洁风格步骤条呈现 <el-steps :active="orderActive" v-if="progresses.length > 0" cla...

2018-08-02 10:51:23 17841 1

转载【vue】在网页上增加水印

https://blog.youkuaiyun.com/zou15590/article/details/80906357基于vue的架构中，在页面上增加水印，代码如下。watermark.js'use strict' let watermark = {} let setWatermark = (str) => { let id = '1.23452384164.1234124...

2018-07-30 10:31:48 2150 2

原创 element 常用组件 ----- 日期组件

<el-form-item label="最晚到货日期：" prop="arrivalDate"> <el-date-picker placeholder="选择最晚到货日期" v-model="arrivalDate" value-format="yyyy-MM-dd" type="date"

2018-07-25 16:45:11 4849

原创 vue+elementui 之 table+pagination

<el-table :data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)" border stripe width="300"> <el-table-col...

2018-03-30 14:11:20 1295

转载 vue之tab标签切换

代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css">

2018-03-19 13:56:07 858

转载 vue 之 tab切换功能实现

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">

2018-03-19 13:53:54 2652

转载 vue之tab实现切换功能（二）

Vue是一个小巧轻便的JavaScript库。它有一个简单易懂的API，能够让开发者在开发web应用的时候更加简易便捷。实际上，一直让Vue引以为豪的是它的便捷性、执行力、灵活性。目前在学习Vue.js。在学习的时候需要把手动操作DOM的思维去掉，因为Vue是数据驱动，不需要手动操作DOM。他通过一些特殊的hmtl语法，将DOM和数据绑定起来。一旦创建了绑定，DOM就会和数据保持同步，每当变更了...

2018-03-19 13:43:26 4058

空空如也

空空如也