自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

浮云神马-潘

web前端,node,vue,angular4等

  • 博客(39)
  • 收藏
  • 关注

原创 小程序使用百度ai审核文本与图片信息

request.jsvar app = getApp();//项目URL相同部分,减轻代码量,同时方便项目迁移var host = app.url;const msg = require("msg.js")// 图片审核验证let mak = '您的百度ai ak'let msk = '您的百度ao sk'function getToken(doSuccess) {...

2019-12-31 09:02:13 737

原创 饿了么ui组件table点击tr展开单行

首先官方给出的案例:<template> <el-table :data="tableData" style="width: 100%"> <el-table-column type="expand"> <template slot-scope="props"> <el-form l...

2019-08-01 14:47:22 1460

原创 vuecli3.9.1架构---部署打包配置区分三种环境,同时支持cdn打包,保证JS最小化的一条龙服务与请求封装案例

首先我的版本如下:vue3.0文件构造简单,仅仅需要自定义vue.config.js即可const path = require('path')function resolve(dir) { return path.join(__dirname, dir)}module.exports = { // 基本路径 publicPath: './', // 输出文...

2019-07-05 10:04:20 4747

原创 vue2.0快速入手指南

一.安装vue-cli1.使用npm(需要安装node环境)全局安装webpack,打开命令行工具输入:npm install webpack -g或者(npm install -g webpack),安装完成之后输入 webpack -v,如下图,如果出现相应的版本号,则说明安装成功。注意:webpack 4.X 开始,需要安装 webpack-cli 依赖 ,所以使用这条命令  npm...

2018-12-11 14:59:26 327

原创 ie兼容-csshack-潘帅亲提

万不得已的情况下可以使用下面的方法:safari下 body:nth-of-type(1) #ys{color:red;}  @media screen\9 {   .selector {  property: value; } }  针对火狐浏览器的CSS Hack:@-moz-document url-prefix() {    .selector {        att...

2018-12-11 11:44:50 1799

原创 vue cli3.0去除console.log

首先需要安装插件npm install babel-plugin-transform-remove-console --save-dev其次进入babel.consig.js进行配置const plugins = ["@vue/babel-plugin-transform-vue-jsx"];// 生产环境移除consoleif(process.env.NODE_ENV === 'production') { plugins.push("transform-remove-consol

2020-07-01 11:00:29 552

转载 Vue 开发必须知道的 36 个技巧【近1W字】

前言Vue 3.x 的Pre-Alpha 版本。后面应该还会有 Alpha、Beta 等版本,预计至少要等到 2020 年第一季度才有可能发布 3.0 正式版;所以应该趁还没出来加紧打好 Vue2.x 的基础;Vue基本用法很容易上手,但是有很多优化的写法你就不一定知道了,本文从列举了 36 个 vue 开发技巧;后续 Vue 3.x 出来后持续更新.1.require.contex...

2019-11-18 10:43:30 289

原创 微信小程序时间转换处理

utils:const formatTime = date => { const year = date.getFullYear() const month = date.getMonth() + 1 const day = date.getDate() const hour = date.getHours() const minute = date.getMinu...

2019-11-04 16:43:41 1260

转载 浏览器缓存机制之强缓存与协商缓存

浏览器缓存基本认识浏览器缓存分为强缓存和协商缓存: 浏览器在加载资源时,先根据这个资源的一些http header判断它是否命中强缓存,强缓存如果命中,浏览器直接从自己的缓存中读取资源,不会发请求到服务器。当强缓存没有命中的时候,浏览器一定会发送一个请求到服务器,通过服务器端依据资源的另外一些http header验证这个资源是否命中协商缓存,如果协商缓存命中,服务器会将这个请求返回,但是不...

2019-09-28 14:22:31 263

原创 es6常用语法

1.let 和 constvar 问题??1.可以重复声明2.不能定义常量3.不支持块级作用域 (js 以前只有全局作用域,块级作用域)2.解构赋值/* 结构 分解一个对象的结构 */let arr = [1, 2, 3];//结构的时候,等号两边结构类似,右边还必须是一个真实的值let [a, b, c] = arr;console.log...

2019-07-18 09:55:23 168

转载 http 缓存

HTTP缓存首先是解决困扰人们的老大难问题:一、什么是HTTP缓存 ?http缓存指的是: 当客户端向服务器请求资源时,会先抵达浏览器缓存,如果浏览器有“要请求资源”的副本,就可以直接从浏览器缓存中提取而不是从原始服务器中提取这个资源。常见的http缓存只能缓存get请求响应的资源,对于其他类型的响应则无能为力,所以后续说的请求缓存都是指GET请求。http缓存都是从...

2019-07-18 09:43:23 139

原创 关于swiper 4.5.0版本在vue中出现的火狐兼容BUG

在其他浏览器中,swiper均可正常运行,可偏偏在火狐浏览器下swiper.js不起作用解决办法:给swiper的调用写一个函数,同时给该函数写一个 setTimeout 简单粗暴。。。。...

2019-07-03 10:51:15 1224 1

原创 element-ui table组件采用min-width导致部分页面闪烁的解决方案

该BUG是由于饿了么UI下的min-width会自己通过js换算,然而部分浏览器的宽度是包含了滚动,所以宽度变来变去导致了闪烁,官方很多方法都是无效的,其实仅仅只需要给table的最外一层父容器添加overflow: auto;即可解决我则是在css中添加:/* 解决饿了么ui 滚动闪烁BOG */.el-table__footer-wrapper, .el-table__hea...

2019-07-01 09:35:03 5137 1

原创 vscode自动保存流程

前端编码工具 不强求,根据个人喜好,但是推荐vscode,轻量级,自己可以随时集成各式各样的插件为了规范统一配置:项目根目录下建.vscode文件夹文件夹里面建settings.json文件保存时候代码格式化:{ "editor.formatOnSave": true, "editor.tabSize": 2, "editor.detectIndentati...

2019-06-18 17:54:25 2065

转载 vue项目优化--使用CDN和Gzip

使用vue-cli构建的vue项目,在打包发布的时候,发现打包后的文件体积很大,使用webpack-bundle-analyzer分析后,发现占用空间最多的是引用的第三方依赖。第三方的依赖文件可以使用cdn外链的方式引入,这样就能大大缩小项目文件的体积。具体实现(以我个人项目为例)我的项目中引入了以下模块vuevue-routervuexaxiosmomenthighlight.j...

2019-06-06 14:38:31 294

原创 vue2.0组件通讯----实战

很多人用了keepalive之后,经常遇到数据添加之后,导致其他路由模块下的数据么有实时更新,解决方法可以有很多,我推荐使用如下的通讯:案例: 组件一触发事件,刷新组件二的数据刷新函数main.js:var bus = new Vue();Vue.prototype.bus = bus;在组件一种的事件中加入:this.bus.$emit('punchCardop');...

2019-04-19 09:53:16 137

原创 Vue2.0最新的模拟动态路由添加

判断权限的方法可以不限于vuex,只要能拿到均可,以下只展示路由具体写法:router下的index.js:export const constantRouter = [{ path: '/', name: 'index', component: Index }]// 动态需要根据权限加载的路由表let lv = 2if(lv==2){ //...

2019-04-10 13:07:48 413

原创 vue面试题

1. 谈谈你对MVVM开发模式的理解MVVM分为Model、View、ViewModel三者。Model 代表数据模型,数据和业务逻辑都在Model层中定义;View 代表UI视图,负责数据的展示;ViewModel 负责监听 Model 中数据的改变并且控制视图的更新,处理用户交互操作;Model 和 View 并无直接关联,而是通过 ViewModel 来进行联系的,Model 和 Vie...

2019-02-22 16:37:57 299

原创 vue项目中遇到的那些事

正文 照例放上一些项目中用到的权威的官网    vue 官方api:https://cn.vuejs.org/    vue资源精选:http://vue.awesometiny.com/    vue GitHub地址:https://github.com/vuejs/vue    element-ui 官方中文api:http://element-cn.eleme.io/#/zh-CN/co...

2019-02-15 17:44:12 436 1

原创 AngularCLI命令速查表

命令列表名称 作用 ng init 在当前目录下创建应用 ng new 创建新的目录并在新目录下运行ng init命令 ng serve 启动 ng doc 在浏览器中打开Angular文档并搜索当前关键字 ng e2e 使用 protractor 在当前应用中运行e2e测试 ng format 使用 clang-format ...

2019-01-22 10:50:39 302

原创 ionic3服务器请求新闻列表信息以及点击跳转详情

一、首先引入请求,传送门:https://blog.csdn.net/weixin_41404460/article/details/83110952二、使用脚手架新建一个列表页和一个详情页,在列表page页中写入以下代码:&lt;ion-list&gt; &lt;ion-item *ngFor="let item of newslist; let i=index" (c...

2018-11-15 15:52:22 576 1

原创 ionic 调用百度地图API,并定位当前位置示例

由于在ionic程序中,我们一般使用的ES5 或 ES6 或者是Typescript。 这与JS 还有有一些区别的。所以,在我们的程序中,代码与官方示例代码格式上不完全相同。下面,简单说明一下如何在 ionic 程序中 调用 百度地图API.1. 在ionic程序中,定位到文件: \src\index.html.  添加如下代码 , 注意将“您的密钥” 替换成 您申请的密钥&lt;s...

2018-11-12 13:57:42 2106 1

原创 angular 6引入echarts的具体方法

方式: 使用echarts和ngx-eachrts两个依赖,借助于ngx..,是因为echarts是基于js编写,没有ts文件。所以就使用ngx-echarts来使用即可。第一步:安装依赖 1 2 npm install echarts --save npm install ngx-echarts --save 第二步:在Module...

2018-10-29 17:58:29 3876

转载 CSS高度自适应 height:100%;

在初次尝试高度自适应时都会遇到这样的问题:对象的heith:100%; 并不能直接产生实际效果为什么呢?之所以没有效果,与浏览器的解析方式有一定关系,查看下面代码&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;一...

2018-10-27 14:11:42 1124

原创 angular6 rxjs6的新特性汇总

Angular6的升级,略有影响的地方应该主要集中在Rxjs6,而至于http,在Angular4.3之后就发生了变化。rxjs的变换rxjs6主要在包的结构/pipe的使用方式/API的重命名这几点与旧版本的使用方式不相容的变更,所以导致在实际使用中,有如下的变化旧版 新版(4.3之后) Http HttpClient Response HttpRespo...

2018-10-17 16:03:53 2464

原创 那些年你踩过的坑,都在这里了~|面试题填坑大全

HTML 1、什么是盒子模型?    有些面试官会问你对盒子模型的理解,在我们平时看到的网页中,内部的每一个标签元素它都是有几个部分构成的:内容(content)、外边距(margin)、内边距(padding)、边框(border),四个部分组成,当你说完这些面试官是不会满意这个答案的,因为还有一个重点(IE盒模型和标准盒模型的区别)———IE盒模型的content包括border、...

2018-10-15 17:38:13 770

原创 02-ionic编写登录以及用户昵称更改教程

继续上次的01 ionic教程更新 附上源码地址:https://pan.baidu.com/s/1wNHUVe2qcKjwSWv4DTqzIQ  注意:node.js建议安装最新版,然后安装Storage,才可以运行ionic serve 在上次的案例代码基础上新增一个pages,name is user.-user.html源码:&lt;!-- G...

2018-08-28 15:48:56 571

原创 ionic 数据刷新路由解决办法

官网给出的都是navCtrl方法,其他地址也都是给出的是什么路由视图刷新。试了好久,没有试出来。今天获得谷歌大神的支持,得知 modal方法需要 modal自身关闭后进行回调://因为modal关闭的时候,不会再次触发父页面的ionViewDidEnter(); 故而补充的更多页面ts代码如下:import { Component } from '@angular/core';...

2018-08-28 15:33:14 1021 1

原创 01-ionic3编写登录功能

界面如下:一、首先新增5个tab页面标签,其中一个是more组件pages。html代码如下:<!-- Generated template for the MorePage page. See http://ionicframework.com/docs/components/#navigation for more info on Ionic ...

2018-08-24 17:13:22 7225 11

原创 ionic 3最新的测试版安装搭建流程

第一步输入指令:ionic start 如图所示输入项目名之后即可傻瓜式 生成tabs+angular4+语法的项目环境第二步输入指令:ionic generate,如图所示,一键式的傻瓜操作指令,界面可操作程度堪称完美哟。...

2018-07-26 16:16:00 1498

原创 Angular4.x开发环境及项目创建指令汇总

一.安装Node.js官方网址:https://nodejs.org/en/download/在命令行中输入:node -v 和 npm -v 验证版本二.全局安装Angular CLI 脚手架工具使用npm命令安装  npm install -g @angular/cli 安装cnpm 国内直接装经常会出问题,所以设置为淘宝镜像地址会更好。 npm ins...

2018-07-23 16:43:43 963

原创 node.js零基础详细教程(7.5):mongo可视化工具webstorm插件、nodejs自动重启模块Node Supervisor(修改nodejs后不用再手动命令行启动服务了)

注:由于使用Nodejs操作mongodb的时候,会有两个很蛋疼的地方,1、修改nodejs文件后需要重新命令行 node node.js去运行,2、数据库需要使用命令行查询,不能直接可视化操作所以有了这章,给大家介绍两个插件来解决这两个问题。 mongo可视化插件 Mongo Plugin 这个插件可以在各大编辑器中使用,这里介绍在webstrom中的安装1、文件 -- &gt; 设置     ...

2018-06-23 17:01:35 430

原创 node.js零基础详细教程(7):node.js操作mongodb,及操作方法的封装

node.js操作mangodb 创建一个用于放置今天文件的文件夹,npm init初始化一下,并创建demo1.js用于写node代码使用npm install [email protected],将mongodb控制模块安装到本地 (由于后来的mongodb版本操作方法有改变,这里使用 @2.2.33来安装这个版本,下图是后来换的,所以和前面命令行的截图风格不同)  在demo1.js中写入下面操作...

2018-06-23 16:53:04 205

原创 node.js零基础详细教程(6):mongodb数据库操作 以及导入导出

数据库 数据库管理结构,一般分为两种:B/S架构   C/S架构。B/S架构:  Browser/Server,浏览器/服务器模式,即通过浏览器和服务器端的数据库进行交互C/S架构:  Client/Server,客户端/服务器模式,即通过客户端和服务器的数据库进行交互(我们使用的cmd命令行就可以算是一个客户端) 数据库根据数据结构分为:关系型数据库和非关系型数据库关系型数据库就如一般很规整的表...

2018-06-23 16:50:54 641

原创 node.js零基础详细教程(5):express 、 路由

expressExpress 是一个基于 Node.js 平台的极简、灵活的 web 应用开发框架,它提供一系列强大的特性,帮助你创建各种 Web 和移动设备应用。其实可以简单的将express理解为node.js的一个类库:我们在使用javascript的时候,会使用到jQuery,我们可以同理将express理解为node.js的一个类库。 我们先创建一个文件夹用于放今天的代码。(我的示例代码...

2018-06-23 16:48:47 315

原创 node.js零基础详细教程(4):node.js事件机制、node异步IO操作

node.js事件机制 node.js是单线程,但是通过事件和回调支持并发,可以实现非常高的性能。node.js所有的API都是通过异步调用。第一堂课的时候,我们写过一个同步和异步的示例(如下),当初说到:同步代码先执行完成,然后才执行异步代码。setTimeout(function(){ console.log(1000000000);},0);for(var i=0; i&lt;...

2018-06-23 16:37:41 157

原创 node.js零基础详细教程(3):npm包管理、git github的使用

npm包管理 什么是npmnpm是随同NodeJS一起安装的包管理工具,只要安装了node,我们就可以通过命令行使用npm启动命令行,运行 npm -v  就可以看到npm的版本号,根据安装的node版本不同,内部集成的npm页不同,只要能显示一个办号,就表示npm可用 npm作用:允许用户从NPM服务器下载别人编写的第三方包到本地使用。允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使...

2018-06-23 16:35:52 3271

原创 node.js零基础详细教程(2):模块化、fs文件操作模块、http创建服务模块

模块儿化 为什么需要模块儿化?我们以前的常规js代码中,我们为了重用一些js代码,是将js方法封装起来,放到js文件中,然后在HTML页面中引入js,就可以在页面中使用这些方法了。当这种直接引入和调用的方式存在一些不友好的地方,比如,1、如果两个js中有重名的方法,就会产生覆盖。2、如果某个js需要调用另一个js里的方法,那么就对js引入的顺序有限制,就比如我们使用jQuery的时候一般在js的最...

2018-06-23 16:33:55 213

原创 node.js零基础详细教程(1):安装+基础概念

node.js安装 百度云盘有本教程需要的软件  链接:http://pan.baidu.com/s/1kVPxBJT 密码:uziu 通过官网下载node.js 中文网下载地址 http://nodejs.cn/download/windows系统我们一般选择mis版本,根据自己的电脑系统和位数选择mac选择.pkg版本具体的版本号,一定要安装偶数版本的,因为基数版为开发版本,偶数版为稳定版本 ...

2018-06-23 16:26:00 291

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除