自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(20)
  • 收藏
  • 关注

原创 发布模式中使用babel-plugin-transform-remove-console去掉所有console

vue项目中在开发阶段的时候,调试代码经常会console,但是console数量一但达到一定程度则会影响项目运行速度,这时就需要借助插件来帮助快速删除所有的console代码插件的官网:https://www.npmjs.com/package/babel-plugin-transform-remove-console实现步骤在项目中运行 npm install babel-plugin-transform-remove-console --save-dev在babel.config.js中设置

2021-04-22 16:34:24 564

原创 webpack中常用的loader

通过loader打包非js模块先了解loader能做点什么事情。实际开发中,webpack默认只能打包处理.js后缀名结尾的模块,其他非.js结尾的模块无法处理,需要调用loader加载器才可以正常打包,不然会报错loader加载器可以协助webpack打包处理特定的文件模块,如:less-loader 可以打包处理.less相关的文件sass-loader可以打包处理.scss相关的文件url-loader可以打包处理css中与url路径相关的文件如下图loader的调用过程打包处理

2021-04-22 12:00:56 541

原创 webpack中使用html-webpack-plugin生成预览页面

vue项目中,使用webpack配置进行在localhost下默认进入index.html页面的配置使用html-webpack-plugin将src的index页面复制到根目录中并可以默认打开运行npm install html-webpack-plugin -D 命令,安装生产预览页面的插件修改webpack.config.js文件头部区域,添加如下配置信息://导入生成预览页面的插件const HtmlWebpackPlugin = require('html-webpack-plugi

2021-04-21 19:31:28 160

原创 babel和webpack的一些配置

前端工程化介绍在传统的前端开发中,并没有模块化的开发规范,传统开发面临两个问题:1、多个js文件存在多个重名的变量存在变量覆盖问题;2、js文件之间无法实现相互的引用;通过模块化可以解决上述问题,就是把单独的一个功能封装到一个模块中,模块之间相互隔离,但是可以通过特定的接口公开内部成员,也可以依赖别的模块。浏览器端模块化规范:AMD和CMD服务器端模块化规范:CommonJS模块分为单文件模块与包模块成员导出:module.exports和exports模块成员导入:require(‘模

2021-04-21 19:20:53 166

原创 vue路由重定向

路由重定向很简单,就是指用户在访问地址A的时候,强制用户跳转到B页面,因为我们并不想让用户进入系统就看到白白的毫无功能性的页面,初始定向一般为系统的首页或数据展示部分。只需通过redirect属性,指定一个新的路由地址即可var router = new VueRouter({ routes:[ //path表示需要被重定向的原地址,一般为'/',redirect将要被重定向到的新地址 {path:'/',redirect:'/index'} ]})...

2021-04-21 09:59:40 4548

原创 git的普通操作

安装就不再介绍当安装完成后鼠标右键出现 Git Bash Here,点击可进入git第一次需要输入以下指令进行配置1、git config --global user.name 提交人姓名2、git config --global user.email 提交人邮箱3、git config --list 查看git配置信息如果提交的信息不对,可以重复进行这个配置操作上面第一次配置完以...

2020-03-23 10:08:10 126

原创 网络请求的状态码含义

网络请求中Status Code返回的状态码有很多种,下面列举几个常见的状态码,方便查找和记忆数字开头的大概意思:2开头的是收到数据但未必全部收到,3开头的是资源需要重新处理,4开头的都是客户端错误,5开头的都是服务器异常http请求的状态码101 协议转换200 成功返回204 没有响应内容206 响应部分内容301 永久重定向302 暂时重定向304 资源没有变化,继续使用缓...

2020-03-16 15:24:28 303

原创 浅谈vue中组件的运用

vue组件具有独立性、复用性、简单操作定义一个组件便可省去不必要的麻烦,最终将一个功能封装成一个标签进行使用组件分为全局组件和局部组件,整个项目经常用到的用全局写法,用到比较少的专供特定页面用的使用局部组件组件的组成部分://button-end组件的名字Vue.component('button-end',{ data:function(){ return{ //属性的参数...

2020-03-13 14:32:10 188

原创 如何运行WebSocket并进行简单测试

运行WebSocket首先要检查的配置环境:首先下载并安装node环境然后安装淘宝镜像,这样下载会快很多npm config set registry https://registry.npm.taobao.org如果想检测一下是否安装成功,输入npm config get registry此时会出现 https://registry.npm.taobao.org/这个地址,说明安...

2020-03-12 18:05:43 2051

原创 浅谈WebSocket技术

WebSocket是H5新增的一个通讯协议,这个协议使得客户端与服务器之间的数据交互更为简单,并允许服务器主动向客户端发送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。现在大家大多数都在用ajax技术进行数据交互,但用ajax技术浏览器每获取一次数据就需要发送http请求向服务器获取数据,这种传统的模式下,显...

2020-03-12 15:53:48 162

原创 小程序中获取分类页面数据步骤

有的小程序有分类这一项,但位置和方法不相同,这里就将如何获取后台数据并初步渲染说一下data: { // 分类数据 cates: [] }这里cates为什么会是一个数组而不是对象?因为这要根据后台数据文档来定,给的是什么类型,就定义什么类型定义fetchCatesData函数进行获取数据, wx.request后面有url和成功、失败回调函数,如果数据请求有参数则...

2020-03-12 13:41:41 560

原创 小程序轮播图开发步骤

注:本篇轮播图是在首页home上进行开发当创建好项目之后可以进行轮播图开发,而且一般轮播图都会出现在每个项目中在home.js中,通过onLoad获取轮播图数据,并通过fetchSwiperData函数的wx.request来获取url地址@TOC初步获取后台数据data: { // 轮播图数据 swiperData: [] } onLoad() { /...

2020-03-12 13:05:12 310

原创 vue中如何使用富文本框组件

富文本框,就是可以在文本框里面输入文本并携带自我编辑的一种编辑器,使用vue做项目时少不了用到富文本框组件,下面就来说说该组件的使用步骤一、首先要在vue脚手架的依赖按钮中添加新的依赖vue-quill-editor二、导入相关文件和全局样式// 导入富文本编辑器import VueQuillEditor from 'vue-quill-editor'import 'quill/dist...

2020-03-03 14:49:49 2926

原创 当写vue项目的时候,如何删除所选的数据项?

如何才能点击删除按钮删除对应的商品需要以下步骤一、在删除按钮上绑定点击事件,并通过 scope.row.商品对应的id 这种方式获取对应的id值<template slot-scope="scope"> <el-button size="mini" type="primary" icon="el-icon-edit"></el-but...

2020-03-02 17:05:17 1457

原创 vue中如何在搜索框中实现关键字搜索

vue中用element组件库搭建搜索框进行搜索时,怎么进行关键字查询搜索呢<!-- 搜索框 --> <el-input placeholder="请输入内容" v-model="queryInfo.query" clearable @clear='getGoodsList'> <el-button slot="appen...

2020-03-02 15:58:30 4741

原创 element组件库的Cascader 级联选择器使用

element-ui组件库的Cascader 级联选择器,vue项目中经常能用到的一个组件,但里面的属性较多,现将梳理一下,以供参考就以官方给的hover 触发子菜单为例,给出了以下参数<el-cascader expand-trigger="hover" v-model="value" :options="options" :props="cateProps...

2020-02-27 12:25:43 975

原创 如何使用element-ui中的分页组件

分页组件里面的属性比较多,下面先看看官方给的都有哪些属性<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage4" :page-sizes="[100, 200, 300, 4...

2020-02-26 15:53:26 1519

原创 如何使用vue-table-with-tree-grid的树形表格组件

平时我们用element-ui组件库的时候,用的很多组件都可以解决日常工作中的需要,最近遇到了一个需要搭建一个树形结构的表格,但element组件没有提供,这时就需要自己去通过第三方组件来实现这个功能了。那么如何才能实现这样的结构方式呢?就需要通过vue-table-with-tree-grid这个组件了一、在vue脚手架的依赖项的开发依赖,搜索并安装vue-table-with-tree-g...

2020-02-26 14:32:38 9827 5

原创 web开发中,手机设备开发的框架有哪些

今天我总结了一些关于专为移动端开发而设计的框架,里面包含了我们平时常用的也有一些冷门的框架,供大家参考吧!1、 jQuery MobilejQuery Mobile 是 jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。jQuery Mobile开发团队说:...

2020-01-15 09:54:23 614

转载 css属性position的三种方法

CSS中Position属性有三个可选值,它们分别是:static、absolute、fixed、relative。(还有一种是无定位,在此不谈)◆position:absolute 绝对定位使用position:absolute,能够很准确的将元素移动到你想要的位置,◆position:fixed 相对于窗口的固定定位这个定位属性值是什么意思呢?元素的定位方式同absolute类似,但它...

2020-01-04 21:18:00 157

空空如也

空空如也

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

TA关注的人

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