vue
CahierX
前端小菜鸟
展开
-
正则表达式获取url中的前缀 即http + ip + 端口号
var a = /^http(s|):\/\/\S*?\//原创 2020-10-30 13:19:06 · 2427 阅读 · 0 评论 -
vue 上拉加载页面不重新加载,强行刷新组件导致画面重绘的解决方案
将需要渲染的list改成数组对象,每次加载下一页时将所有数据push到list中,页面用for循环list<div v-for="(item,index) in list" :key="index"> <myList v-if="!loading" :listData="item" /></div>// 通过push的方法每次新增一列改变list的...原创 2020-04-15 21:37:10 · 858 阅读 · 0 评论 -
js深度合并两个数组对象
js合并两个数组对象, 如果a中含有b,则b的值覆盖a的值 如果a中不含有b 则b的值新增到aMergeRecursive(obj1, obj2) { // 合并两个数组 for (var p in obj2) { if (obj1[p] === undefined) { // 如果obj1没有p 直接把obj2的p加入 obj1[p] = obj...原创 2020-04-01 18:33:01 · 1647 阅读 · 0 评论 -
js 树状结构的数据搜索指定元素所在的节点
利用递归搜索指定元素所在的节点 searchTree(element, id) { // 根据id查找节点 if (element.id == id) { return element; } else if (element.child != null) { var i; var result = nul...原创 2020-04-01 18:29:46 · 2944 阅读 · 0 评论 -
Vue mixins的简单使用
首先新建一个文件 mixinsPopicker.jsexport const AllPopPicker = { data() { return { newPickerOne: '', }, mounted() { this.initPopPicker() }, beforeRouteLeave(to, from, next) { //...原创 2020-03-09 17:12:42 · 323 阅读 · 0 评论 -
axios封装异步接口 async await
新建一个api.jsimport axios from "axios"; import qs from 'Qs'let getStyleApi = {}getStyleApi = { async getCategory(baseUrl) { try{ let res = await axios.get(baseUrl+`/v1/cloud/category`...原创 2020-02-28 10:07:28 · 1138 阅读 · 0 评论 -
consle.log打印有值, 展开后无值
记录一次诡异的bug, consle.log印有值, 展开后无值代码也非常简单后来发现tempData必须手动初始化name, type, smooth,value,time 等属性不然就会出现上述情况这样就可以了...原创 2020-01-07 14:57:50 · 826 阅读 · 0 评论 -
vue 数据改变页面没有实时渲染(不是一般的情况, 如果一般情况无法解决可能是这个原因)
css3里面的渐变色属性 background-image: linear-gradient(121deg, rgba(36, 237, 255, 1) 0%, rgba(24, 102, 231, 1) 95.6298828125%); -webkit-background-clip: text; -webkit-text-fill-color: transparen...原创 2019-12-24 11:00:12 · 3876 阅读 · 1 评论 -
上中下(左中右)显示三个图片时无缝轮播
思路: 假如有三张图每次到第二张滚第三张的时候在结尾加上第一张, 第三张滚的下一个就是第一张了同时加上第二张,这样就实现了无缝轮播(别打我)咳咳, 上面的思路确实实现了,但是存在一个致命的问题就是一直轮播会一直在后面添加元素,如果次数较多的时候会导致页面卡顿, 那我们就不能一直加如果在再填加了第三张的时候是不是已经页面存在六张图了,我们完全可以利用这六张图让他们自己循环实现无缝轮播...原创 2019-10-31 16:41:16 · 1550 阅读 · 0 评论 -
css 实现点击被遮挡的内层元素
/*内层被遮挡的元素设置auto 实现点击被遮挡的内层元素*/pointer-events:auto/*外层被遮挡的svg设置none*/pointer-events: none;原创 2019-10-31 10:08:50 · 475 阅读 · 0 评论 -
vue等待数据渲染完成后执行下一个方法
watch: { dataDetails: function() { this.$nextTick(() => { this.changeView() }); } },在watch里面写上要监控的数据,上面的例子是监控dataDetails,在this.$next...原创 2019-09-11 10:38:39 · 13113 阅读 · 1 评论 -
JS获取指定范围内的随机数含小数
randomNum(maxNum, minNum, decimalNum) { // 获取指定范围内的随机数, decimalNum指小数保留多少位 var max = 0, min = 0; minNum <= maxNum ? (min = minNum, max = maxNum...原创 2019-09-11 10:31:40 · 3390 阅读 · 0 评论 -
滴滴前端实习二面
关于跨域问题,代理跨域的缺点是什么,如果通过img标签实现跨域请求并到的结果如何自己封装一个tree组件组件之间怎么进行传参如何封装一个table组件看过element的组件源码吗vuex的实现原理项目中遇到了什么问题,如何解决的如何自己封装一个组件,封装组件时用什么方法代替slot,如何根据参数不同组件的功能不同http状态码vue中如何实现页面权限划分组...原创 2019-06-11 23:15:57 · 730 阅读 · 0 评论 -
滴滴前端实习一面
说说Envent Loop宏队列和微队列JS闭包输入一个网址,中间发生了什么事,当请求到数据时浏览器具体怎么渲染的谈谈VUEX聊聊ES6如何解决跨域问题说说你项目中印象最深刻的部分,如何解决的如何实现控件的拖拽功能浏览器缓存策略http每个状态码的含义说说JS中的继承,具体说说原型链继承call,apply,bind 他们三者的区别说说面对大量数...原创 2019-06-11 17:27:45 · 470 阅读 · 0 评论 -
vue原生分页插件
How to usenpm i el-paginationImport on your pageimport Pagination from 'el-pagination/Pagination'Attributes Attributes Description Type Optional value Defaults u...原创 2019-06-15 14:02:48 · 632 阅读 · 0 评论 -
北森云计算前端实习面试(一面)
TCP 和UDP的区别TCP协议和UDP协议特性区别总结: 1. TCP协议在传送数据段的时候要给段标号;UDP协议不 2. TCP协议可靠;UDP协议不可靠 3. TCP协议是面向连接;UDP协议采用无连接 4. TCP协议负载较高,采用虚电路;UDP采用无连接 5. TCP协议的发送方要确认接收方是否收到数据段(3次握手协议)...原创 2019-05-28 17:16:13 · 2772 阅读 · 0 评论 -
vue前后端分离解决每次请求session都会变的问题
因为前后端属于不同的域,导致每次ajax请求服务器都会当做新的用户访问,导致session丢失解决方法: <system.webServer> <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="http:/...原创 2018-10-29 10:53:53 · 17731 阅读 · 2 评论 -
formBuilder Preview Popup的应用
需求:表单编辑完成之后,获取编辑的表单格式,转换成html格式存在数据库中以便后期用户填写查看官方api找到了方法jQuery(function($) { let options = { dataType: 'xml', onSave: function(evt, formData){showPreview(formData)}, formData: '&l...原创 2018-10-27 17:08:52 · 309 阅读 · 0 评论 -
element table 修改字体颜色
<el-table-column prop="isPass" label="是否通过"> <template scope="scope"> <span v-if="scope.row.isPass==='审核通过'" style="color: green">审核通过</span> &a原创 2018-11-07 21:45:02 · 23935 阅读 · 3 评论 -
vue角色不同动态分配路由权限,实现权限的控制
首先说一下大概的思路router路由第一次只加载登录注册和404页面 当用户成功登录后,使用vuex设置用户的Token 如果Token存在,角色信息不存在,就去后台获取该用户的详细信息,包含但不限角色信息,将角色信息存在vuex中 如果Token存在,角色信息也存在,表明已经获取过了角色信息,直接进入系统 根据vuex中的角色信息去匹配router里面的符合要求路由,动态挂载.........原创 2018-11-23 15:22:35 · 25287 阅读 · 6 评论 -
ES6 随手记
数组去重function dedupe(array) { return Array.from(new Set(array));}dedupe([1, 1, 2, 3]) // [1, 2, 3]let arr = [3, 5, 2, 2, 5, 5];let unique = [...new Set(arr)];// [3, 5, 2]map, filterl...转载 2019-03-18 16:26:20 · 104 阅读 · 0 评论 -
js-xlsx解决数字太长科学计数法
var sheet = XLSX.utils.table_to_sheet(objE.childNodes[0], { raw: true })// 将一个table对象转换成一个sheet对象,raw为true的作用是把数字当成string,身份证不转换成科学计数法加上{ raw: true }即可...原创 2019-03-29 16:38:36 · 3466 阅读 · 1 评论 -
使用js将json数据导出excel(xls、xlsx、csv),并过滤掉不需要的数据
首先看一下json数据的格式,这是其中一条的格式我们只需要label中的值和value中的值导出到excel中[{ "type": "text", "required": true, "label": "姓名", "className": "form-control", "name": "text-1553770509298", "value": "xx", "subtype"...原创 2019-03-29 17:08:14 · 5555 阅读 · 2 评论 -
vue数据更新视图不渲染
现在有这样一串数据(formData)现在的需求是这串数据已经渲染完毕,但是我要往每列数据里面新增一个noWritedNum属性并赋值,因为这个属性的值在另外一个请求的结果中,这个请求需要formData中的id作为参数。我于是尝试了下面几种方法。第一种方法(失败): 在获取formData时拿到id,写个for循环去请求noWritedNum(id),嗯,,,请求成功了,也...原创 2019-03-30 16:04:32 · 2234 阅读 · 0 评论 -
JS forEach、for...in 、for...of 的区别
forEachmyArray.forEach(function (value)){ console.log(value)}// 无法中途跳出forEach循环,break和return 无效for...infor...in 可遍历数组的键名for(var index in myArray){ console.log(myArray[index])}/...原创 2019-04-26 11:09:15 · 175 阅读 · 0 评论 -
JS为对象添加Iterator接口
ES5://如为对象添加Iterator 接口;let obj = { name: "XX", age: 20, job: 'teacher', [Symbol.iterator]() { const self = this; const keys = Object.keys(self); let index...原创 2019-04-27 10:16:37 · 2766 阅读 · 4 评论 -
Vue 监听关键字进行查询,并进行防抖与节流操作
在utils下新建debounce.js 代码如下:/** * 函数防抖 (只执行最后一次点击) * @param fn * @param delay * @returns {Function} * @constructor */export const Debounce = (fn, t) => { const delay = t || 500 let time...原创 2019-04-25 10:32:16 · 1741 阅读 · 0 评论 -
用户输入表单数据后,定时将数据保存在本地localStorage,若提交不成功或退出页面,下次进入页面时加载上次未提交的数据
首先将数据存储在localStorage中,因为localStorage只能存字符串我这里是json,现将json转为字符串保存 autoSaveData() { // 将填写的数据但未提交保存在本地 this.tempData = [] this.tempData.push(this.formID) this.tempData.push(t...原创 2019-05-14 11:35:35 · 3766 阅读 · 0 评论 -
Elemnet dialog遮罩挡住了弹窗
<el-dialog :visible.sync="dialogVisible" :modal-append-to-body="false" // 加上这个属性即可解决 title="修改密码" >若还是不行加上 :append-to-body="true" 再试一次 <el-dialog :visible.s...原创 2019-05-16 22:10:00 · 167 阅读 · 0 评论 -
在vue中使用FormBuilder,setData is not undefined
今天在vue使用formbuilder,点击页面想自动加载setData让表单自动加载,官方的例子是这样子的var fbEditor = document.getElementById('build-wrap');var formBuilder = $(fbEditor).formBuilder();var formData = '[{"type":"text","label":"Ful...原创 2018-10-25 17:17:01 · 1355 阅读 · 2 评论