- 博客(77)
- 收藏
- 关注
RSS订阅原创 富文本框光标处插入文本 -vue wangeditor
解决此问题，发博客记录一下（happy ending~）富文本框项目中是采用了wangeditor，具体引用可看wangeditor官方文档。 刚开始一直纠结于如何获取文本框中光标的位置，找了网上很多的例子，但在wangeditor中都不能适用。深度扒了下wangeditor文档，没找到对应方法。在官方文档搜索栏死马当活马医的搜了下“insertHTML””，还真有这个方法TAT。一行代码搞定~html<div id='wangeditor'> <di...
2020-08-12 15:38:56
5340
11
原创 Vue中 scss不支持/deep/写法问题
在style有scoped属性时，要改变element-ui某个深层元素（eg:.el-input__inner）或其他深层样式时，需要使用/deep/，如.conBox /deep/ .el-input__inner{ padding:0 10px;}如果/deep/报错，可采用::v-deep.conBox ::v-deep .el-input__inner{ padding:0 10px;}...
2020-08-06 16:05:39
7367
4
原创 JS获取指定字符的前/后值
str = "12345?789”str.split("?")[0] 输出为 12345str.split("?")[1] 输出为 789(split("?")为指定分割字符；[0]为分割后取前面的值，[1]为分割后取后面的值)
2020-08-04 15:30:40
532
原创 vsCode 插件
1.Auto Close Tag 自动补齐标签2.Auto Rename Tag 自动重命名存在的标签3.Chinese 中文语言包4.Git Histoty git提交历史5.ESLint 检测代码规范性6.Vetur Vue项目必备7.Path Intellisense 补全路径
2020-07-23 16:49:00
245
原创 浏览器四大内核
1 IE浏览器内核:trident内核,也是俗称的IE内核.2 chrome浏览器内核,以前是webkit内核,现在是blink内核.3FireFox浏览器内核,GECKO内核.4 opera浏览器内核.最初是presto内核,后来是webkit,现在采用blink内核.5 safari浏览器内核,采用webkit内核....
2020-07-09 21:26:50
411
原创 webpack常用配置项 知识点
入口(entry)入口起点(entry point)指示 webpack 应该使用哪个模块，来作为构建其内部依赖图的开始。进入入口起点后，webpack 会找出有哪些模块和库是入口起点（直接和间接）依赖的。每个依赖项随即被处理，最后输出到称之为bundles的文件中，我们将在下一章节详细讨论这个过程。可以通过在webpack 配置中配置entry属性，来指定一个入口起点（或多个入口起点）。默认值为./src。接下来我们看一个entry配置的最简单例子：webpack.co...
2020-07-09 18:20:56
341
原创 常见的css清除浮动方法
最常见的是after伪元素清除浮动.clearfix:after{ content:''; display:block; visibility:hidden; height:0; clear:both;}
2020-07-08 14:39:16
469
原创 HTML5 CSS3新特性
H5 新特性语义化标签：header、footer、section、nav、aside、article 增强型表单：input 的多个 type 新增表单元素：datalist、keygen、output 新增表单属性：placehoder、required、min 和 max 音频视频：audio、video canvas 地理定位 拖拽 本地存储：localStorage - 没有时间限制的数据存储；sessionStorage - 针对一个 session 的数据存储，当用户关闭浏
2020-07-08 14:28:12
164
原创 VUE 代理服务器实现跨域
什么是跨域 跨域指浏览器不允许当前页面的所在的源去请求另一个源的数据。源指协议，端口，域名。只要这个3个中有一个不同就是跨域。 这里列举一个经典的列子：协议跨域http://a.baidu.com访问https://a.baidu.com；#端口跨域http://a.baidu.com:8080访问http://a.baidu.com:80；#域名跨域http://a.baidu.com访问http://b.baidu.com；代理服务器实现前端跨域请求后端地址1.config
2020-07-07 18:04:23
567
原创 css 实现文字竖向排布
.text{ margin: 0 auto; height: 140px; writing-mode: vertical-lr;/*从左向右 从右向左是 writing-mode: vertical-rl;*/ writing-mode: tb-lr;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*/ }
2020-07-02 10:22:59
771
原创 css 实现渐变色并兼容
.transtion{ background:-webkit-linear-gradient( #fff, #000 50%, #fff ); background:-moz-linear-gradient( #fff, #000 50%, #fff ); ba...
2020-03-07 11:23:26
326
原创 element-ui switch开关 点击按钮后，弹窗确认后再改变开关状态
设置active-value和inactive-value属性，分别代表激活状态的值和关闭时候的值，与value绑定。接受Boolean,String或Number类型的值。<el-switch v-model="itemValue" active-value="100" inactive-value="0" @chan...
2019-12-25 14:02:07
4444
3
原创 element-ui 改变table:hover时表格的效果
.el-table__body tr:hover>td { background-color: #3dc7ab !important;}
2019-11-16 11:34:46
2727
原创 Element-ui 给el-select添加唯一class名，修改个别el-option样式
我们修改了列表项的样式，但是页面中可能会使用多个select组件，直接修改会影响全局样式，在页面渲染的时候，el-select总是会被渲染为仅次于body层级的div，我们没有办法通过父级限制它，所以我们需要给它自身添加一个class名。<div class = "optionsContainter"> <el-select v-model="val...
2019-11-11 11:11:13
11844
2
原创 vue函数中this的指向
在下面的例子中可以看出，普通函数的this指向的就是Vue的实例，this.message可以获取到data中的值，而箭头函数的this指向了window，不能获取到值<script> new Vue({ el : '#app', data : { message : "hello vue!" }, ...
2019-11-07 10:11:43
1366
原创 git 拉取远程仓库分支代码方法
1.在本地新建一文件夹用来存放项目代码 （eg:xny）2.进入该文件，右键选择 git bush here，打开命令窗后，输入初始化命令：git init3.命令行：git remote add origin 后面是项目所在远程仓库地址（不是远程分支名称，而是仓库地址）4.拉取远程分支到本地：git fetch origin dev(dev是你要拉取的远程分支名称)5.在本地创建...
2019-11-07 09:12:55
12175
原创 高德地图 自适应展示所有Marker
var map = new AMap.Map('container', { resizeEnable: true, center: [116.397428, 39.90923], zoom: 13 }); map.clearMap(); // 清除地图覆盖物 var markers = [{ i...
2019-11-01 17:27:56
3654
原创 Element-ui的tree树形控件获取所有选中的节点
<el-tree :props="defaultParams" ref="tree" :data="treedata" show-checkbox node-key="id" @check-change="handleCheckChange"></el-tree>handleCheckChange () { let res = t...
2019-10-30 16:33:36
3577
2
原创 快速实现 遮罩层效果
html<div class="marsk"></div>css.marsk { z-index:5; position:absolute; top:0; bottom:0; left:0; right:0; backgrount:#000; opacity:0.3;}
2019-10-09 13:50:08
265
原创 对原型链的理解
要理解原型和原型链首先要知道几个概念：在js里，继承机制是原型继承。继承的起点是对象的原型（Object prototype）。 一切皆为对象，只要是对象，就会有proto属性，该属性存储了指向其构造的指针。 Object prototype也是对象，其proto指向null。 对象分为两种：函数对象和普通对象，只有函数对象拥有『原型』对象（prototype）。 pro...
2019-10-08 11:32:05
243
转载 常见的浏览器兼容性问题总结
1.不同浏览器的标签默认外补丁margin和内补丁padding不同发生概率：100%解决方案：使用CSS通配符*，设置内外补丁为0*{ margin: 0; padding: 0;}2. 块属性标签float之后，又有横向的margin值，在IE6中显示会比设置的大（IE6双边距bug）发生概率：90%解决方案：在float标签样式控制中加入display:...
2019-10-07 22:15:57
210
原创 什么是闭包
什么是闭包?简单来说，闭包是指可以访问另一个函数作用域变量的函数，一般是定义在外层函数中的内层函数。即重用一个变量，又保护变量不被污染的一种机制。为什么需要闭包？局部变量无法共享和长久的保存，而全局变量可能造成变量污染，所以我们希望有一种机制既可以长久的保存变量又不会造成全局污染。特点占用更多内存 不容易被释放何时使用？变量既想反复使用，又想避免全局污染如...
2019-10-07 22:09:32
3495
原创 HTML CSS JS 加载顺序
1、加载按html文档顺序加载，先加载head中引入的外部文件。然后加载body内部代码，img文件最后加载。2、写网页时最好将js文件的引用以及自己写的代码放在最下面，这样在操作DOM时不易出错，因为DOM结构已经加载完毕。 正常的网页加载流程是这样的。浏览器一边下载HTML网页，一边开始解析 解析过程中，发现<script>标签 暂停解析，网页渲染的控制权转交给...
2019-10-07 21:53:33
565
原创 浏览器、项目中的优化
1. 减少 HTTP请求数 这条策略基本上所有前端人都知道，而且也是最重要最有效的。都说要减少 HTTP请求，那请求多了到底会怎么样呢 ?首先，每个请求都是有成本的，既包含时间成本也包含资源成本。一个完整的请求都需要经过 DNS寻址、与服务器建立连接、发送数据、等待服务器响应、接收数据这样一个 “漫长” 而复杂的过程。时间成本就是用户需要看到或者 “感受” 到这个资源是必须要等待这个过程结束的...
2019-10-07 21:43:32
223
原创 vue 回到页面顶部（scrollIntoView详解）
1.给顶部的div加一个id<div id="content"> <div style="width:100%;height:900px;position:relative"> <button @click="returnTop" style="position:absolute;bottom:10px;left:0">返回顶部&l...
2019-09-28 16:50:26
9430
1
原创 git 提交代码到远程仓库
1.提交代码之前，需要先把远程仓库的代码再次拉取到本地进入文件夹右键选择git bush here 在命令框中输入：git pull origin dev(dev是远程仓库的分支名称)这时远程最新的代码已经被拉取到了你本地仓库，但是还没有同你本地仓库的代码合并2.将修改的文件暂存到本地 git add . (“.”代表暂存所有修改的文件到本地仓库)3.将暂存的文件更新到本地仓库g...
2019-09-05 22:51:57
556
原创 vue-全选单选二级联动
全选按钮<th style="width:5%;text-align: center"> 全选 <input type="checkbox" @click="checkAll($event)" name="" id="selectAll"></th>单选按钮<td class="fatherTd"> <input ty...
2019-08-17 11:41:32
835
原创 element-ui table 对数据进行处理后渲染
html 在需要处理的列上加formatter自定义函数，如下 对票号进行后8位截取<el-table ref="multipleTable" :data="tableData" :height="height-165" @selection-change="handleSelectionChange"> <el-table-column label="票号后8位" ...
2019-08-13 18:42:33
6409
原创 element-ui 表格 排序
使用@sort-change监听排序变化,设置sortable='custom'<el-table :data="tableData" @sort-change='sortChange'> <el-table-column prop="startDate" sortable='custom' label="出票日期"></el-table-column&...
2019-08-02 15:29:26
3674
原创 element-ui 单选-再次选中取消
使用.native修饰符，（native修饰符的作用：你可能想在某个组件的根元素上监听一个原生事件。可以使用 v-on的修饰符.native，可以理解为该修饰符的作用就是把一个vue组件转化为一个普通的HTML标签，但对于普通的HTML标签是没作用的）html<el-radio-group v-model="selects.xc"> <el-radio-bu...
2019-07-26 14:53:17
4507
原创 购物车总价的计算出现多位小数问题
在小数相加时，可能会产生多个小数位。如下所示：var x=1+1; //2var x=1.20+1.11; //2.31var x=1.56+1.76; //3.3200000000000003导致上述原因是因为Javascript的数字类型是以64位的IEEE 754格式存储的。在用的时候一定要小心，测试要到位。解决方法：加上toFixed()函数就可以把函数...
2019-07-09 10:58:30
872
原创 VUE 子组件向父组件传多个值
子组件子组件通过$emit触发父组件中的自定义函数，第一个值为自定义函数名，后面的参数是向父组件传的值<van-button @click="emitGetList" type="info">搜索</van-button>emitGetList(){ this.$emit('refreshList',this.cityValue...
2019-07-01 18:11:01
12809
2
转载 Vue 子组件触发父组件中的函数
Parent.vue<template id=""> <child @refreshList="onRefresList"></child></template><script> export default { components: { Child },...
2019-06-29 17:52:47
535
原创 vue中input的blur影响下拉框中点击事件
<input class="search-ipt" type="search" autocomplete="off" name="search" value="" @focus="inFocus()" @blur="inBlur()" v-model="val" @keydown.enter="search()"><ul class="search-result clearf...
2019-06-25 16:29:46
4012
1
原创 记一次百分比布局出现滚动条问题（我是个傻子吧。。。）
问题代码如下<template> <div id="feedback"> <header> 反馈情况 </header> </div></template><script>export default {}</scrip...
2019-06-11 16:55:25
639
原创 vue中app.vue中设置height:100%无效的问题及解决方法
设置height: 100%;是无效的，在chrome的Elements中发现height仍然是0px.设置高度100%时，div的高度会等同于其父元素的高度。而上面中id为app的div（vue挂载的div）的父节点是body标签，body标签的父节点是html标签。在默认情况下html和body标签的高度为auto，而浏览器是不会自动给标签添加高度的，所以html和body标签就为0，自然...
2019-06-11 16:29:01
10648
1
原创 vscode 同时编辑多处，多个光标 快捷键
一、重命名变量1、首先看看自己需要同时修改多处的代码是不是要重命名一个变量，如果是的话，有现成的快捷键f2。选中一个变量，按f2，弹出一个小窗口，在里面输入内容后按回车，所有该变量都会被重命名。2、但是要注意，在js文件中，如果这个变量没有用var或者const或者let声明，会无法重命名。二、多光标1、按住alt，用鼠标左键点击，可以出现多个光标，输入的代码可以在光标...
2019-06-11 11:22:08
58774
6
原创 vue 导入，下载 2
注意调取导入的请求Content-Type为multipart/form-datahtml代码注意input的type属性为file，input的id和label的for属性相同<input style="display:none;" id="up" ref="file" type="file" class="form-control" @change="tap"> ...
2019-06-04 10:11:34
440
原创 vue 导入导出功能 方式1
封装的axios请求const axiosInstance = axios.create({ baseURL: window.g.URL, responseType: 'json', timeout: 50000});export function fetch(url, params,type){ let promise = new Promise((r...
2019-04-25 17:16:57
2522
原创 vue 图片上传base64
未添加图片时样式图如下添加图片后，多了编辑和查看的按钮html代码中分两个部分：无图片（如图1）/原本存在图片（图2）。根据绑定的firImg判断是否有图片<el-form-item label="产品图标："> <span v-if="firImg" class="spanImg"> <img v-if="firImg...
2019-04-22 17:51:17
1238
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人