vue
文章平均质量分 53
Mark sheng
一切阻挡你成功的都是借口
展开
-
面试官常问到的问题
面试官常问到的问题原创 2022-09-13 10:18:41 · 463 阅读 · 0 评论 -
Vue.js 2.0 教程
Vue.js 介绍Vue.js(读音 /vjuː/, 类似于view) 是一套构建用户界面的渐进式框架。Vue.js安装# 全局安装vue-cli $ npm install --global vue-cli# 创建一个基于 webpack 模板的新项目$ vue init webpack my-project# 安装依赖,走你$ cd my-project $ npm install $ npm run dev插值<span>M...原创 2021-09-18 14:32:53 · 253 阅读 · 0 评论 -
前端笔记(连更中)
111111原创 2021-09-17 13:56:04 · 132 阅读 · 0 评论 -
前端环境配置
一、建立.env系列文件vue项目使用.env文件配置全局环境变量:.env 全局默认配置文件,不论什么环境都会加载合并 .env.development 开发环境 .env.test 测试环境 .env.production 生产环境=========================================================================文件内容:注意:属性名必须以VUE_APP_开头,比如VUE_APP_XXX============原创 2021-09-16 11:38:28 · 1163 阅读 · 0 评论 -
element常用代码合集
增 (this.DataList.push(newData))点击按钮弹出对话框,填写添加内容<el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button><el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose"> <.原创 2021-09-10 10:17:03 · 462 阅读 · 0 评论 -
前端问题锦集
1.gethttp://172.28.15.187:8080/sockjs-node/info?t=1631163185130 net::err_connect如果你遇到以下情况说明你来对地方了进入/node_modules/sockjs.-client/dist/sockjs.js将大约1606行左右的self.xhr.send(payload)注释完美解决...原创 2021-09-16 11:25:45 · 195 阅读 · 0 评论 -
flex布局(marksheng版)
一、flex布局是什么Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。.box{ display: flex;}行内元素也可以使用Flex布局。.box{ display: inline-flex;}Webkit内核的浏览器,必须加上-webkit前缀。.box{ display: -webkit-flex; /* Safari */ display: flex;}...原创 2021-05-10 19:44:48 · 132 阅读 · 0 评论 -
Maximum call stack size exceeded
错误描述直接上错误截图:错误解析以上错误的意思是 "超出最大调用堆栈大小"出现这种错误最常见的原因是:在代码中的某个地方,您正在调用一个函数,该函数又调用另一个函数,依此类推,直到达到调用堆栈限制。这几乎总是因为具有未满足的基本情况的递归函数举例:(function a() { a();})();调用堆栈会一直增长,直到达到限制:浏览器硬编码堆栈大小或内存耗尽。为了解决这个问题,请确保您的递归函数具有能够满足的基本情况(function a(x) { if ( ! ...原创 2021-04-13 11:38:37 · 1991 阅读 · 0 评论 -
try catch 用法(marksheng)
在实际应用中,碰到了一个问题,就是在动态生成一个表格的时候,从后台接收到的的数据和表头名称是不同的接口,而表格的id是在表头名称这个接口动态生成的,所以就会导致一个问题,在火狐浏览器中,响应请求比较慢这个时候我们就可以使用 try catch 方法 来 处理浏览器的位置错误下面是相对简单的例子:try {foo.bar();} catch (e) {if (e instanceof EvalError) { alert(e.name + ":" + e.message);}...转载 2021-04-12 21:02:55 · 777 阅读 · 0 评论 -
前端调用api接口方法总结(marksheng版)
vue-resource(弃用了已经)this.$http.get().then();this.$http.post().then();this.$http.jsonp().then();axios(常用)GET方式:axios.get().then().catch()注:get方式传参数可以直接跟在url后面,也可以通过param对象传POST方式:axios.post().then().catch()注:post方式传参必须用对象传...原创 2021-04-08 11:30:24 · 3185 阅读 · 0 评论 -
path.resolve()理解(marksheng)
学习webpack时遇到path.resolve():output: { filename: '[name].bundle.js', //文件名称 .bundel是一个标记 //把一个路径或路径片段的序列解析为一个绝对路径 path: path.resolve(__dirname,'dist') //__dirname当前路径 },path.resolve([…paths])里的每个参数都类似在当前目录执行一.原创 2021-04-01 11:43:51 · 327 阅读 · 0 评论 -
同步异步与执行栈(marksheng背诵简约版)
同步(顺序) 异步(同时)单线程:同步异步是一种概念,真正在工作的是线程 CPU(纳秒级计算)主要由三大部分组成:逻辑运算单元(ALU)、寄存器、控制单元 串行(同步) 并发(有前后顺序) 伪同步 并行(同时完成) 异步主执行栈和任务队列(微任务和宏任务)——事件循环微任务:process.nextTick、MutationObserver 、Promise。宏任务:setTimeout、setInterval 、setImmediate 、requestAnimat...原创 2021-04-01 08:09:20 · 178 阅读 · 0 评论 -
npm 安装中的 i、-g、--save、--save-dev、-D、-S的区别(marksheng)
npm 安装中的 i、-g、--save、--save-dev、-D、-S的区别说明i 是 install 的简写 -g 是全局安装,不带 -g 会安装在个人文件夹 -S 与 --save 的简写,安装包信息会写入 dependencies 中 -D 与 --save-dev 的简写,安装包写入 devDependencies 中 dependencies 与 devDependencies dependencies 生产阶段的依赖,也就是项目运行时的依赖 devDependen.原创 2021-03-31 19:57:33 · 369 阅读 · 0 评论 -
WebPack(现代 JavaScript 应用程序的 静态模块打包工具)
概念本质上,webpack是一个用于现代 JavaScript 应用程序的静态模块打包工具。当 webpack 处理应用程序时,它会在内部构建一个依赖图(dependency graph),此依赖图对应映射到项目所需的每个模块,并生成一个或多个bundle。入口起点(entry point):指示 webpack 应该使用哪个模块,来作为构建其内部依赖图(dependency graph)的开始。输出(output):告诉 webpack 在哪里输出它所创建的bundle,以及...原创 2021-03-30 14:00:20 · 525 阅读 · 0 评论 -
vue插槽使用(史上最简单的理解方法)
具名插槽//子组件<slot name="footer"></slot>//父组件<child1> <span slot="footer"> <p>我是页尾的具体内容</p> </span> </child1>匿名插槽子组件<slot></slot>父组件<child>原创 2021-03-26 09:09:19 · 118 阅读 · 0 评论 -
Javascript高级程序设计第四版笔记(松爷代言)
序章学习地址MDN(Mozilla Developer Center):火狐开发者社区是一个完整的学习平台,你可以在这里深入学习Web技术以及能够驱动Web的软件 。1. 第六章1.1 Object1.1.1 new操作符let person = new Object(); person.name = "Nicholas"; person.age = 29;1.1.2 对象字面量对象字面量是对象定义的简写形式,目的是为了简化包含大量属性的对象的创建。let per原创 2021-03-25 18:16:37 · 505 阅读 · 0 评论 -
前端基础知识必学(marksheng终结版)
Vue六种传值方式(marksheng珍藏版)vue组件的封装(marksheng珍藏版——前端必备)vuex使用流程(marksheng珍藏——前端必备)P7面试题库(某企业面试题库)原创 2021-03-25 17:56:10 · 176 阅读 · 0 评论 -
vuex使用流程(marksheng珍藏——前端必备)
使用流程1.安装vuexnpm install vuex --save;12.store文件中引入vuex为了方便全局使用,一般会新建一个store文件夹,用于存放相关状态值。文件夹下的index.js作为对外输入接口的主文件。在主文件中引入vuex,并输出store接口。index.js:import Vue from 'vue';import Vuex from 'vuex';export default store;;3.vuex使用index.js:Vue.use(V.原创 2021-03-25 14:51:38 · 270 阅读 · 0 评论 -
vue组件的封装(marksheng珍藏版——前端必备)
vue组件的定义● 组件(Component)是Vue.js最强大的功能之一● 组件可以扩展HTML元素,封装可重用代码● 在较高层面上,组件是自定义元素,Vue.js的编译器为他添加特殊功能● 有些情况下,组件也可以表现用 is特性进行了扩展的原生的HTML元素● 所有的Vue组件同时也都是Vue实例,所以可以接受相同的选项对象(除了一些根级特有的选项),并提供相同的生命周期钩子vue组件的功能1)能够把页面抽象成多个相对独立的模块2)实现代码重用,提高开发效率和代码质..原创 2021-03-25 14:47:20 · 564 阅读 · 0 评论 -
Vue六种传值方式(marksheng珍藏版)
Vue六种传值方式前言:六种传值方式为:属性传值 $refs $parent 通知传值(广播传值) 本地传值 路由传值在介绍组件传值之前先明确三种组件关系:父子组件、兄弟组件、无关系组件上图关系基于:A、B组件同一时刻只存其一的情况下,其中:A是C、D、E的父组件,B是F、G、H的父组件 C、D、E是A的子组件,F、G、H是B的子组件 C和D、E是兄弟组件,F和G、H是兄弟组件。但E、F不是兄弟组件 A和B是无关系组件,E和F也是无关系组件...原创 2021-03-25 14:36:36 · 164 阅读 · 0 评论 -
vue如何给自己封装好的组件加click事件(marksheng)
根据Vue2.0官方文档关于父子组件通讯的原则,父组件通过prop传递数据给子组件,子组件触发事件给父组件。但父组件想在子组件上监听自己的click的话,需要加上native修饰符当你使用 <Menu>组件时<Menu mode="horizontal" theme="dark" :active-name="$route.path" > <MenuItem name="/" to="/" @click.native="handclick(1)">...转载 2021-03-23 18:56:23 · 1037 阅读 · 0 评论 -
5分钟搞懂vuex(MarkSheng)
先说一下vuex到底是什么?vuex 是一个专门为vue.js应用程序开发的状态管理模式。这个状态我们可以理解为在data中的属性,需要共享给其他组件使用的部分。也就是说,是我们需要共享的data,使用vuex进行统一集中式的管理。vuex中,有默认的五种基本的对象:state:存储状态(变量) getters:对数据获取之前的再次编译,可以理解为state的计算属性。我们在组件中使用 $sotre.getters.fun() mutations:修改状态,并且是同步的。在组.转载 2021-02-26 07:42:59 · 182 阅读 · 0 评论 -
vue项目路由权鉴(单个路由)
beforeEnter(to,from,next){ if(sessionStorage.getItem("token")){ next() }else { alert("请先登录"); next('/') } },...原创 2021-01-18 10:33:35 · 214 阅读 · 0 评论 -
js原型链,继承和promis的基本理解
一、原型链开局一张图prototype每个函数都有一个prototype属性,被称为显示原型2._ proto _每个实例对象都会有_ proto _属性,其被称为隐式原型每一个实例对象的隐式原型_ proto _属性指向自身构造函数的显式原型prototypeconstructor每个prototype原型都有一个constructor属性,指向它关联的构造函数。原型链获取对象属性时,如果对象本身没有这个属性,那就会去他的原型__proto__上去找,如果还查不到,就去找原创 2020-11-24 18:13:03 · 2501 阅读 · 7 评论 -
P7小实训面试题大全(marksheng)
目录HTML&CSS盒模型与BFC1. 什么是盒子模型?2.盒子模型有哪两种3.标准和怪异模型的转换4.JS盒模型5.对BFC规范(块级格式化上下文:block formatting context)的理解?6.瀑布流原理7.h5 和css3 的新特性JavaScript4.垃圾回收机制5.什么是内存泄漏?6.Vue 中的内存泄漏问题7.js的数据类型、堆栈存储、多数据类型计算12.js中数组排序(冒泡、快速、插入)13.深...原创 2021-01-06 19:11:30 · 1944 阅读 · 0 评论 -
vue跨域解决方案(marksheng)
可以在Vue项目 config文件夹下的index.js找到proxyTable并设置如下代码proxyTable: { "/api":{ target: 'http://127.0.0.1:8080', changeOrigin: true, pathRewrite: { '^/api': '' } }},并且取main.js设置如下代码Vue.prototype.$Api =原创 2021-01-06 15:30:31 · 124 阅读 · 0 评论 -
深度监听啊
当需要监听一个对象的改变时,普通的watch方法无法监听到对象内部属性的改变,此时需要deep属性对对象进行深度监听data () { return { form: {id: 1, name: 'milky'} } }, watch: { form: { handler(newVal, oldVal) { // ... }, deep: true, immediate: true }immediate表示在w原创 2020-12-30 19:43:05 · 627 阅读 · 0 评论 -
如何向打游戏一样学习?(摘自大佬,如有冒犯,请多包涵)
阶段性反馈机制(如何持之以恒、让自己发疯)反馈机制是王者荣耀的核心武器,击杀野怪获得金币,击杀敌人之后的画面、音效刺激大脑,不断地努力,获得奖励是我们不断的玩这个游戏的主要原因,也是人的本能,我什么都得不到凭什么这么做?,对记得初二的时候,父亲说如果你能考全校第三我就给你买一台电脑,当时我从全校xx名考到了全校第x名,而这只用了一个月的时间,还有,我希望给电脑换一个内存条,为什么?因为我希望电脑变得很快,对奖励机制十分重要,所以如果想要努力的做一件事情,就要反复的告诉自己我如果做成功了,能得到什么?而能原创 2020-12-17 09:20:19 · 2360 阅读 · 1 评论 -
IT行业接项目的方法总结(接私活可用)
首先了解下众包和外包的区别:外包:外包是将项目承包给外包公司,由外包公司的程序员进行开发;众包:众包是将项目承包给多个独立的开发者,他们不隶属于任何公司,用自己的业余时间接私活,进行开发。接单的方法:朋友介绍 如果自己工作的时间长,熟悉软件行业,人缘好,认识的朋友多,单子会比较多。 社交平台 通过QQ群、微信朋友圈、微博、百度贴吧、百度知道、知乎等社交平台,发布自己的作品,吸引客户前来洽谈。 自有渠道 通过自己的博客和网站,展示自己的开发实力和作品,同时做好搜索引擎优化,让原创 2020-12-16 09:14:05 · 7350 阅读 · 3 评论 -
vuecli4打包优化(Marksheng)
一、去除生产环境sourceMapsourceMap资源映射文件,存的是打包前后的代码位置,方便开发使用,这个占用相当一部分空间module.exports = { // 根据你的实际情况更改这里 publicPath, assetsDir: 'assets', lintOnSave: true, productionSourceMap: false,}1 2 3 4 5 6 7 8二、对资源文件进行压缩需要下载compression-webpa.原创 2020-12-16 09:08:29 · 378 阅读 · 0 评论 -
节流防抖函数(Marksheng)
使用节流防抖函数(性能优化)那么在 vue 中怎么使用呢:在公共方法中(如 untils.js 中),加入函数防抖和节流方法// 防抖export function _debounce(fn, delay) { var delay = delay || 200; var timer; return function () { var th = this; var args = arguments; if (timer)原创 2020-12-16 09:05:46 · 220 阅读 · 0 评论 -
如何理解汉诺塔的递归?不理解你打我(Marksheng)
三个盘子的汉诺塔你总会吧:[公式]a3=7好吧, 那就把中间的柱子看成目标柱a4=a3+1+a3[公式]an=2(an-1)+1更多的话也是一样的…所以 [公式]所以说一共就三步把 n-1 号盘子移动到缓冲区把1号从起点移到终点然后把缓冲区的n-1号盘子也移但终点????就这这么简单,会的回赞????呦,谢谢...原创 2020-12-16 09:03:19 · 179 阅读 · 0 评论 -
git的基本理解
git是什么:git 是分布式版本管理控制系统,没有网络也不影响正常工作git工作流程:本地目录 ———— 暂存区 ———— 本地仓库 ————远程仓库git常用的命令:git init 初始化仓库git add . 添加到暂存区git commit - m "注释" 提交到本地仓库git remote add origin 仓库地址 连接远程仓库git push 远程仓库git status 查看状...原创 2020-12-16 08:22:24 · 241 阅读 · 0 评论 -
git简单明了
git简单明了:remote directory 远程仓库???? ????history 本地仓库???? ????stage(index) 暂存区 git commit -m???? ????working directory 本地目录 git add..原创 2020-12-14 18:41:15 · 113 阅读 · 0 评论 -
错误日志记录
命令失败:npm安装——日志级别错误(解:文件路径不能有中文) eslint报错Missing space before function parentheses的问题意思是在方法名和刮号之间需要有一格空格。 "space-before-function-paren": 03....原创 2020-12-10 20:49:08 · 494 阅读 · 0 评论 -
npm安装任何包都报错的解决办法(真的是火大就记录下来了)
npm安装任何包都报错的解决办法不知道什么原因,安装nodejs后,用npm安装任何东西都报错:C:\Users\Administrator>npm install expressnpm ERR! Windows_NT 6.1.7601npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install"...原创 2020-12-09 16:45:25 · 4653 阅读 · 4 评论 -
这15个Vue自定义指令,让你的项目开发爽到爆(vue.)
这15个Vue自定义指令,让你的项目开发爽到爆受 AngularJS 的启发,Vue 内置了一些非常有用的指令(比如v-html和v-once等),每个指令都有自身的用途。完整的指令列表可以在这里查看.这还没完,更棒的是可以开发自定义指令。Vue.js 社区因此得以通过发布自定义指令npm 包,解决了无数的代码问题。以下就是我最喜欢的 Vue.js 自定义指令列表。不用说,这些指令为我的项目开发节省了大量时间!1. V-Hotkey仓库地址:https://github.com/D...原创 2020-12-09 11:40:35 · 453 阅读 · 0 评论 -
vue-ripple-directive点击水波纹(个人)
安装npm install vue-ripple-directive --savemain.js引入import Ripple from 'vue-ripple-directive'Vue.directive('ripple', Ripple);Ripple.color = 'rgba(0, 0, 0, 0.2)'; //自定义水波纹颜色 <div class="rippleBtn" v-ripple>水波纹按钮</div>...原创 2020-12-09 11:37:24 · 634 阅读 · 0 评论 -
vue图片懒加载 —— vue-lazyload的使用(Marksheng)
前言:图片是网站优化的一个重点,图片懒加载是其中比较好用的一个方法。jquery也有很多图片懒加载的插件,今天看了一下vue的图片懒加载插件 ----vue-lazyload。1. 安装:cnpm install vue-lazyload --save-dev(当然可以用npm或者yarn哦)2. main.js 中全局引入: import VueLazyLoad from 'vue-lazyload' Vue.use(VueLazyLoad, { preLo...原创 2020-12-16 09:00:47 · 520 阅读 · 1 评论 -
虚拟Dom的基本理解
1、概念:虚拟DOM其实就是用一个原生的JS对象去描述一个DOM节点,实际上它只是对真实 DOM 的一层抽象。最终可以通过一系列操作使这棵树映射到真实环境上。相当于在js与DOM之间做了一个缓存,利用patch(diff算法)对比新旧虚拟DOM记录到一个对象中按需更新, 最后创建真实的DOM2、虚拟dom原理流程模板 ==> 渲染函数 ==> 虚拟DOM树 ==> 真实DOM vuejs通过编译将模板(template)转成渲染函数(render),执行渲染函数可以得原创 2020-12-04 08:44:37 · 3537 阅读 · 0 评论