前端
关注
分享
扫一扫
bellediao
这个作者很懒，什么都没留下…
展开
-
vue-resource-1.3.4.js
/*!* vue-resource v1.3.4* https://github.com/pagekit/vue-resource* Released under the MIT License.*/!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?defin...原创 2021-04-11 16:00:57 · 2657 阅读 · 0 评论 -
Echart之通过点击事件进行标线
Echart之通过点击事件进行标线https://blog.csdn.net/z_dmsd/article/details/101561641?depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4&utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4...转载 2021-04-01 09:10:13 · 2683 阅读 · 0 评论 -
《前端》简单的js加密解密-2021年3月1日
首先介绍两个简单、原生的加密解密方式。1、英文加密解密btoa：加密 atob：解密2、英文加密解密escape：加密 unescape：解密 console.log("===适合于数字、字母的加密解密===") var str = 'diaolihui' var str1 = window.btoa(str) console.log('原来数据是：', str) console.log('加密后：', str1) var str2 = w原创 2021-03-01 15:01:20 · 300 阅读 · 0 评论 -
《前端》drag-拖拽学习-2021年2月27日
拖拽功能实现原理和说明： 1、说明：拖拽实现一般有两种方式，一种是使用html的新特性dragable，但是由于在火狐浏览器上dragable每拖拽一次会打开一个新的标签， 尝试阻止默认行为和冒泡都无法解决，所以使用第二种方法来实现拖拽。第二种方法是使用js监听鼠标三个事件，配合节点操作来实现。 2、实现原理： 01-在允许拖拽的节点元素上，使用on来监听mousedown(按下鼠标按钮)事件，鼠标按下后，克隆当前节点 02-监听mousemov...原创 2021-02-27 14:33:40 · 910 阅读 · 0 评论 -
《前端》使用webpack+vue从零开始打造前端项目(2020最新版)八--todolist功能--bilibili-2021年2月16日
项目准备安装Vetur插件，并做配置、devtool等。组件拆分之目录结构与框架搭建mainheader组件实现1、页面显示2、样式3、原创 2021-02-16 12:05:48 · 159 阅读 · 0 评论 -
《前端》使用webpack+vue从零开始打造前端项目(2020最新版)八--解析ES6工具--bilibili-2021年2月9日
Babel 官网：https://www.babeljs.cn/webpack：https://www.babeljs.cn/setup#installation一、使用Babel安装：npm install --save-dev babel-loader @babel/core配置：{ module: { rules: [ { test: /\.m?js$/, exclude: /node_modules/, u原创 2021-02-09 09:59:56 · 125 阅读 · 0 评论 -
前端》使用webpack+vue从零开始打造前端项目(2020最新版)七--生产环境打包、提取公共代码--bilibili-2021年2月9日
一、原创 2021-02-07 09:39:26 · 305 阅读 · 0 评论 -
《前端》bootstraptable行数据的获取-2021年2月1日
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>try</title> <!-- 引用 css--> <link rel="s...原创 2021-02-01 09:41:45 · 225 阅读 · 1 评论 -
《前端》Bootstrap-Table事件和方法--未整理
Bootstrap-Table事件和方法本文章为整理之后的，仅供参考官方文档地址：http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/事件的调用方法，前面有过案例$('#table').bootstrapTable({ data: "", uniqueId: "id", locale: "zh-CN", columns: [], .......});转载 2021-02-01 08:29:50 · 267 阅读 · 1 评论 -
《前端》使用webpack+vue从零开始打造前端项目(2020最新版)六--热模块替换HMP、SourceMap--bilibili-2021年2月7日
休息休息原创 2021-01-29 18:36:38 · 154 阅读 · 0 评论 -
《前端》使用webpack+vue从零开始打造前端项目(2020最新版)五--开发环境的配置-devServer--bilibili-2021年1月27日
官网：https://www.webpackjs.com/guides/development/https://www.webpackjs.com/configuration/dev-server/watch mode（不常见）webpack-dev-server（常用）webpack-dev-middleware开发环境配置（一）devServer为我们提供了一个简单的服务器，并能够实时重新加载。1、安装npm install -D webpack-dev-...原创 2021-01-27 19:56:21 · 551 阅读 · 2 评论 -
《前端》bootstraptable2021-01-26
Bootstrap：Bootstrap_table第一篇：快速用bootstrap_table（支持参数）筛选并展示数据，固定表格前几列，实现表格单元格编辑https://www.cnblogs.com/lelexiu/p/10196062.htmlbootstrapTable 中的td过长 需要加省略号并且鼠标悬停显示全部首先需要在html里加style="table-layout:fixed;width: 100%;" <table class="table tab...原创 2021-01-26 14:14:57 · 211 阅读 · 0 评论 -
开发环境配置--2021年1月23日
Watch Modedev-server原创 2021-01-23 16:51:52 · 151 阅读 · 0 评论 -
《前端》使用webpack+vue从零开始打造前端项目(2020最新版)四--插件的使用--bilibili-2021年1月27日
九、插件在某个时间点，自动执行的处理程序（一）html-webpack-plugin：打包结束时，在dist目录下自动生成index.html 文件，并把打包好的js文件引入到html中。1、安装：npm install -Dhtml-webpack-plugin2、配置插件：（1）在webpack.config.js中引入插件（2）在plugins:[],中添加配置内容。再次打包之后，只要npm run build，index.html 就自动打包到dist中。但是自.原创 2021-01-23 10:00:49 · 275 阅读 · 0 评论 -
《前端》使用webpack+vue从零开始打造前端项目(2020最新版)三--css、stylus打包及使用--bilibili--2021-01-22
七、css打包css文件是前端项目不可少的文件，webpack通过css-loader和style-loader来打包css文件。1、安装css-loader和style-loader安装file-loader时，css-loader已经安装好了，可以在package.json中查看。安装style-loader：npm install -D style-loader2、在webpack.config.js中添加规则书写顺序：按照从右到左，从下到上3、创建css文件在sr原创 2021-01-22 22:56:11 · 355 阅读 · 0 评论 -
《前端》css实现闪现高亮-2021年1月21日
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">...原创 2021-01-21 14:56:43 · 242 阅读 · 0 评论 -
《前端》使用webpack+vue从零开始打造前端项目(2020最新版)二之file-loader、url-loader----bilibili2021-01-18
五、file-loader 基本使用1、安装：npm install -D file-loader此时：2、接下来需要对webpack进行配置（设置打包规则）3、在src文件夹下，新建assets文件夹，用于存放资源文件。以导入1.png为例：在app.vue中，写入importimgfrom'./assets/images/1/png'怎么实现导入图片的过程的：（从配置文件开始看起）从打包入口main.js 开始，开始打包，就开始加载内容，当加载到a...原创 2021-01-20 21:30:39 · 346 阅读 · 1 评论 -
《前端》使用webpack+vue从零开始打造前端项目(2020最新版)一最基础的小demo学习--bilibili--2021-01-18
bilibili中找到一个讲的很好的webpack+vue教程：https://www.bilibili.com/video/BV157411V7Dh?from=search&seid=13060654339969180489代码见git：一、准备工作1、项目初始化： npm init -y 生成package.json2、安装webpack和webpack-cli npm install -D webpack webpack-cli （...原创 2021-01-18 20:20:22 · 310 阅读 · 0 评论 -
《前端》illegal invocation报错之浅谈contentType = false--2021-01-08
问题描述：在使用jQuery封装的ajax请求的时候，用于上传图片,表单等一系列。里面formData方法传入作为data的属性值的时候，会出现这个错误contentType: false,// 告诉jQuery不要去设置Content-Type请求头processData: false,// 告诉jQuery不要去处理发送的数据contentType告诉服务器从浏览器提交过来的数据格式。默认值是：contentType = "application/x...原创 2021-01-08 19:23:00 · 658 阅读 · 0 评论 -
《前端》ECharts 点击事件的 param参数--2021年1月7日
var myChart = echarts.init(document.getElementById("echarts"));myChart.on('click', function (param) { alert(param.seriesName); //legend的名称 alert(param.name); //X轴的值});myChart.setOption(option,true);// 使用刚指定的配置项和数据显示图表。param参数包含的内容有：pa...原创 2021-01-07 14:55:39 · 649 阅读 · 1 评论 -
《前端》页面刷新时，弹出框闪现问题-2021年1月5日
解决：把<el-dialog>放在外面，就不会出现闪现问题。原创 2021-01-05 14:42:21 · 376 阅读 · 0 评论 -
记录一次终于又能登录webpack项目-2021年1月5日
换了新电脑装了nodejs等一系列软件还是不会启动项目也不知道哪里的问题。bug都记录在文章里面了。这次的问题可能是最有意义的。出现问题：解决方案：删掉node_modules.安装readme的说明就行：npm install----》 npm run dev注意npm install 太慢， 我一晚上都没下好，后来选择用淘宝镜像。很快成功了。...原创 2021-01-05 06:11:38 · 158 阅读 · 0 评论 -
《前端》webpack之npm速度过慢的解决方案
因为npm连接的数据源网站太慢，可以使用淘宝提供的npm数据源，npm config set registry https://registry.npm.taobao.org使用NPM（Node.js包管理工具）安装依赖时速度特别慢，为了安装Express，执行命令后两个多小时都没安装成功，最后只能取消安装，笔者20M带宽，应该不是我网络的原因，后来在网上找了好久才找到一种最佳解决办法，在安装时可以手动指定从哪个镜像服务器获取资源，我们可以使用阿里巴巴在国内的镜像服务器，命令如下：npm in转载 2021-01-05 06:02:12 · 547 阅读 · 0 评论 -
《前端》webpack报错：npm ERR! vue-admin-template@4.4.0 dev: `vue-cli-service serve`
直接用VS Code 打开项目，先输入 npm init -y ，然后在终端输入npm run dev的时候，提示错误信息：PS C:\Users\Bella\Desktop\vue-admin-template-master> npm run dev> vue-admin-template@4.4.0 dev C:\Users\Bella\Desktop\vue-admin-template-master> vue-cli-service serve'vue-cli-se转载 2021-01-04 20:42:32 · 21727 阅读 · 11 评论 -
《前端》webpack-没有node_modules导致的报错--2021-01-04
直接用VS Code 打开项目，先输入 npm init -y ，然后在终端输入npm run dev的时候，提示错误信息：最后看了一些资料，很多都说用淘宝镜像来运行：cnpm install使用这个命令首先得安装淘宝镜像。我没有用这个。后来看到也可以直接用npm install来运行。最后再执行npm run dev...原创 2021-01-04 20:39:22 · 492 阅读 · 0 评论 -
《前端》npm install 命令的集合
npm install xxx会把X包安装到node_modules目录中 不会修改package.json 之后运行npm install命令时，不会自动安装X-g全局安装-S， --save会把X包安装到node_modules目录中 会在package.json的dependencies属性下添加X 之后运行npm install命令时，会自动安装X到node_modules目录中-P, --save-prod: Package will appear in yourdep转载 2021-01-04 20:20:36 · 368 阅读 · 0 评论 -
《前端》nrm报错--2021-01-04
安装nodejs时直接用上面的命令分别安装了nodejs，npm，和nrm，安装后 nrm ls 错误，查了一下，发现是node版本太低，我windows上node版本是10.16，ubuntu上只是4.2，更新nodejs版本即可。node -v4.2.1sudo npm cache clean -fsudo npm install -g nsudo n stable sudo ln -sf /usr/local/n/versions/node/<新的版本号>...原创 2021-01-04 20:10:57 · 165 阅读 · 0 评论 -
《前端》nrm解惑-2021-01-04
一、nrm是什么？nrm是一个管理npm的工具二、nrm的安装$npm install -g nrm三、nrm命令$nrm ls // 查看所有的支持源（有*号的表示当前所使用的源,以下[name]表示源的名称）$ nrm use [name] // 将npm下载源切换成指定的源$ nrm help // 查看nrm帮助$ nrm home [name] // 跳转到指定源的官网如果在你的网络不太理想或者在不能FQ的情况下，又或者收到其他网络限制导致不能...原创 2021-01-04 19:55:35 · 167 阅读 · 0 评论 -
《前端》el-menu导航栏实现方法--2021年1月3日
项目场景和问题描述：之前做的全供应链看板，不同页面是用页签实现的。现在领导要求用导航栏的方式展现。我当时觉得手册有案例应该很简单，但是，把自己????了，做导航栏很简单，但不同页面怎么跳转呢？网上查别人博文都是用router，但是我怎么都不成功。原因分析：后来可利说，我这是在html文件中，不能使用vue-router。等今年我要学会webpack打包项目的那种方式。现在先使用html能支持的方式来实现。两种解决方案：我能实现到的地方-实现不了点击导航栏在右侧出页面内容<body>原创 2021-01-03 07:29:10 · 759 阅读 · 0 评论 -
《前端》webpack踩坑之 npm : 无法将“npm”项识别为 ~~~-用管理员打开vscode
项目场景：问题描述：运行vue项目 提示 npm : 无法将“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查原因分析：解决方案：用管理员打开vscode原创 2020-12-28 20:14:26 · 483 阅读 · 0 评论 -
《前端》前端获取数据，后端的数据也能过来，就是渲染不上的踩雷。原来是var在作怪
踩坑，避雷前端获取数据，后端的数据也能过来，就是渲染不上。原来是这里在作怪。这里为什么不能加var？原因：this重新赋值了导致this为空所以渲染不上。原创 2020-12-27 20:19:01 · 745 阅读 · 0 评论 -
《前端》vue的el-form-item标签的label展示名称左右对齐
这里写自定义项目场景：问题描述：解决方案：功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入项目场景：外协pc端看板问题描述：vue的el-form-item标签的label展示名称左右对齐。vue的el-form-item原创 2020-12-21 10:36:12 · 31132 阅读 · 3 评论 -
《前端》bootstrapTable冻结列-只要加个height就可以固定表头
JS组件系列——自己动手扩展BootstrapTable的 冻结列 功能：彻底解决高度问题https://www.cnblogs.com/landeanfen/p/7095414.html(2条消息) BootstrapTable冻结表头（一）_累行客-CSDN博客_bootstraptable冻结表头 https://blog.csdn.net/csdnluolei/article/details/86508317冻结表头：只要加个height：...原创 2020-12-20 21:04:25 · 584 阅读 · 0 评论 -
《前端》element-ui分页功能各属性讲解
<el-paginationstyle="text-align:center;margin-top:14px;margin-bottom:16px"backgroundlayout="total,sizes,prev,pager,next,jumper"@current-change="changePage1":total="fieldData.pageLength"></el-pagination>elementu...原创 2020-12-20 21:01:07 · 5799 阅读 · 0 评论 -
《前端》bootstraptable中选中一行，获取该行某字段的值
原创 2020-12-14 10:32:45 · 2014 阅读 · 0 评论 -
《前端》Pagination 分页功能-2020-12-10
分页：设置layout，表示需要显示的内容，用逗号分隔，布局元素会依次显示。prev表示上一页，next为下一页，pager表示页码列表，除此以外还提供了jumper和total，size和特殊的布局符号->，->后的元素会靠右显示，jumper表示跳页元素，total表示显示页码总数，size用于设置每页显示的页码数量。https://cloud.tencent.com/developer/section/1489889...原创 2020-12-10 15:26:50 · 1899 阅读 · 0 评论 -
《前端》js实现把table导出成excel--2020-12-08
示例1：我的gethub。示例2：<html><head> <p style="font-size: 20px;color: red;">使用table标签方式将json导出xls文件</p> <button onclick='tableToExcel()'>导出</button></head><body> <script> ...原创 2020-12-08 11:07:51 · 310 阅读 · 0 评论 -
《前端》bootstrapTable表头调整列宽-colResizable
需要引入的文件：bootstrapTable基本引入文件：bootstrap-3.3.4.css、bootstrap-table.min.css、jquery-3.5.1.min.js、bootstrap-3.3.7.min.js、bootstrap-table.min.js表头调整列宽需要再引入：colResizable-1.6.js代码：<!DOCTYPE html><html lang="en"><head> <m.原创 2020-12-05 16:22:38 · 1442 阅读 · 2 评论 -
《前端》vue数据绑定学习记录--2020年12月2日
在使用vue做前端开发的时候，数据交互基本是在标签之间使用两个花括号。利用v-for循环数据，使用花括号往里面渲染数据。如：<div v-for="item in list">{{item.name}}</div>但是在标签里面的属性怎么渲染数据呢？<div v-for="item in list" > <p :timestamp="item.time"></p></div>...原创 2020-12-02 11:15:15 · 71 阅读 · 0 评论 -
《前端》css3动画效果
transform变换效果 语法：transform: none|transform-functions;translateX(x) 定义转换，只是用 X 轴的值。 translateY(y) 定义转换，只是用 Y 轴的值。 translateZ(z) 定义 3D 转换，只是用 Z 轴的值。 rotateX(angle) 定义沿着 X 轴的 3D 旋转。 rotateY(angle) 定义沿着 Y 轴的 3D 旋转。 r...原创 2020-11-18 16:23:04 · 255 阅读 · 0 评论