随笔分类 - 前端学习
自己看前端视频的一些基础学习，加油，颜孙达
摘要：传统的写法不好记忆，书写麻烦，此时可以使用结构赋值的方法让代码更加简洁。 数组结构是将数组中的单元值快速批量赋值给一系列变量的简介语法。 变量的顺序对应数组单元值位置一次进行赋值操作。 如下： 应用一：交换两个变量 Js前面有那种情况需要加分号。（不加分号 解析器认为和上局是连成一句的） 一：数组解
阅读全文
摘要：使用箭头函数的目的：引入箭头函数目的是更加更加简短的函数写法并且不绑定this，箭头函数的语法比函数表达式更加简洁 使用场景：箭头函数更加适用于哪些本来需要匿名函数的地方 定义语法： const fn = () => { } 使用方式一：括号里面加形参 // 箭头函数 const fn = (x)
阅读全文
摘要：什么是闭包？ 简单理解：闭包=内层函数+外层函数的变量。正如前面所说的作用域链也会涉及到闭包，如下： let a = 6;//全局作用域 function f() { a = 7;//父级作用域 function d(){ a = 8;//自己的作用域 console.log(a); } d();
阅读全文
摘要：作用域链本质上就是使用的是哪个变量，全局变量，局部变量，自身的变量。这个在看别人代码的逻辑的时候非常有用，底层是变量的查找机制。 嵌套关系的作用域窜连起来形成了作用域链 在函数被执行，会优先查找当前函数作用域中的变量。 如果当前函数作用域找不到，则会逐级查找父级作用域，知道全局作用域 相同作用域链中
阅读全文
摘要：函数分为具名函数和匿名函数，具名函数需要先声明在进行调用，而匿名函数是完全没有值。 例如：我们设置点击事件中的function就是匿名函数 document.addEventListener('click', function(){ }) 我们可以设置匿名函数立即执行。 好处是一方面可以防止变量污染
阅读全文
摘要：1、在el-menu开启路由模式，default-active使用动态值等于当前路由，就需要用:default-active="$route.path" 2、阿里巴巴矢量图icfont的使用 ①将自己需要的图标下载到矢量库对应的项目文件中 ②更新对应的css代码，点击css代码链接，更新到本地去 ③
阅读全文
摘要：我们在做web页面，由其是后台的页面的时候，需要菜单栏和右侧内容区域分隔开来，例如如下的功能： 就需要使用flex弹性内容的布局。 当我们为父盒子设置为flex后，子元素的float,clear和vertical-align属性将失效 在flex布局中，是分为主轴和侧轴两个方向，同样的叫法有：行和列
阅读全文
摘要：1、父组件向子组件传值，通过标签加上":" <user-add-editor :dialogFormVisible.sync="dialogFormVisible"></user-add-editor> 其中dialogFormVisible 就是子组件的值，sync表示子可以修改父组件。 2、父组
阅读全文
摘要：在Vue.js中使用Element UI时，如果需要给组件的属性加上冒号（:），这表示你正在绑定一个动态属性。冒号后跟的是一个JavaScript表达式，而不是一个字符串。 例如，如果你想要绑定一个动态的值到el-input组件的value属性，你应该这样写： <el-input :value="d
阅读全文
摘要：100%和100vh的区别12 在CSS中，height: 100%表示元素的高度将与其父元素的高度相同。但是，要使height: 100%生效，父元素必须具有明确定义的高度，例如固定高度值或相对定位。如果父元素的高度未被明确定义，那么height: 100%将不会生效。 另一方面，heig
阅读全文
摘要：桌面版PC对应网站 Element UI 开发 H5 和多端小程序 NutUI 3.0 京东的组件 MorJS Mor (发音为 /mɔːr/，类似 more) 是饿了么开发的一款基于小程序 DSL 的，可扩展的多端研发框架。使用小程序原生 DSL 构建，使用者只需书写一套（微信或支付宝）小程序，就
阅读全文
摘要：什么情况下我应该使用 Vuex？ Vuex 可以帮助我们管理共享状态，并附带了更多的概念和框架。这需要对短期和长期效益进行权衡。 如果您不打算开发大型单页应用，使用 Vuex 可能是繁琐冗余的。确实是如此——如果您的应用够简单，您最好不要使用 Vuex。一个简单的 store 模式就足够您所需了。但
阅读全文
摘要：js 中有一个sessionstrage，其意思是当浏览器会话存在的时候会有session数据， 当用户关闭标签页同时清空浏览器session数据的时候会被清除。我们可以在不会发生大的改变，同时经常用到的存储到session strage中。 用法：sessionStrage.setItem('us
阅读全文
摘要：axios是基于promise的http库，可以用在浏览器和node.js中 特性:从浏览器中创建XMLHttpRequests、从node.js创建http请求、支持promiseApi、拦截请求和响应、取消请求、自动转换JSON数据、客户端支持防御xsrf axios就是一个库，也可以单独独立出
阅读全文
摘要：当打包构建应用时，JavaScript包会变的很大，影响页面加载。如果我们把不同路由对应组件分割成不同的代码块， 然后当路由被访问的时候才加载对应组件，这样就会更加高效 vue Router支持开箱即用的动态导入，这意味着你可以用动态导入代替静态导入 将import Login from '@/vi
阅读全文
摘要：vue Cli是基于vue.js进行快速开发的完整系统 vue脚手架使用语法： vue init <模板名称> <项目名称> vue init webpack vue-spa2 安装完成就有项目目录，如下： cd vue-spa2 npm install 运行 npm run dev build 构
阅读全文
摘要：router.beforeEach表示全局前置守卫，即从一个组件跳到另外一个组件这个过程可以进行控制。 // 一打开页面的时候就会执行,访问任何一个组件都会触发 router.beforeEach((to, from, next) => { console.log('全局前置导航守卫执行了'); c
阅读全文
摘要：有query传参和params传参 query:通过路由传参进行拼接,如下： <router-link :to="{name:'login',query:{id:10110,username:'yansunda'}}">登录组件</router-link> 采用编程式导航使用query，使用$rou
阅读全文
摘要：实际生活中的应用界面，通常由多层组件构成，同样，URL中各段动态。路径也按某种结构对应嵌套的各层组件。 我们使用children属性来完成。 let routes = [ { path:'/user',component:User, children:[ { path:'userList', com
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<
阅读全文
浙公网安备 33010602011771号