- 博客(22)
- 收藏
- 关注
原创 前端常见面试题(详解)——持续更新中
Vue 实例从创建到销毁的过程,就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、卸载等一系列过程,我们称这是 Vue 的生命周期初始化 beforeCreate created挂载 beforeMount mounted更新 beforeUpdate updated销毁 beforeDestroy destroyed一、创建前 / 后在beforeCreate生命周期函数执行的时候,data和method 还没有初始化在created 生命周期
2022-01-02 20:33:43 863
原创 vue过滤器,计算属性,侦听器
一. vue过滤器1.定义及使用过滤器只能用在, 插值表达式与 v-bind 表达式中语法:全局定义的过滤器,在main.js 中定义 Vue.filter("过滤器名", (值) => {return "返回处理后的值"})局部定义的过滤器 filters: {过滤器名字: (值) => {return "返回处理后的值"} 2.传参与多过滤器可同时使用多个过滤器, 或者给过滤器传参...
2021-11-24 00:39:36 356
原创 基本路由传参
1.基本路由传参传:this.$router.push('/path地址?参数名=值&参数2=值2this.$router.push({ path:'/path地址', query:{ 参数名:值, 参数2:值2 }})收: this.$route.query.参数名 this.$route.query.参数2 2.动态路由匹配路由配制{ path:'/xxx/:参数名?', // ...
2021-11-22 00:24:12 595
原创 组件的使用及组件的传值
1.组件的基本使用2.组件的通信,父向子传值,子向父传值,兄弟组件之间的传值3.单项数据流4.使用props,emit进行父子组件传值,使用ref实现组件传值,使用双向绑定 v-model实现组件间传值,使用.sync修饰符实现组件传值
2021-11-19 00:05:20 1010
原创 git 基本使用
1.git的四个区域工作区(Working Area)暂存区(Stage)本地仓库(Local Repository)远程仓库(Remote Repository)2.四个状态未修改(Origin)已修改(Modified)&未追踪(Untracked)已暂存(Staged)已提交(Committed)已推送(Pushed)3.git的基本使用-拉取别人的代码1.拉取代码: git clone 地址 只拉取了主分支的代码2.拉取远程其他分支的代码.
2021-11-15 23:07:56 239
原创 路由前置导航守卫
路由值发生改变时会触发路由路由前置守卫语法router.beforeEach((to, from ,next) => { console.log(to); console.log(from); console.log(next);}) //路由跳转之前先执行这里,决定是否要跳转 //参数1: 要跳转到的路由 //参数2: 从哪里跳转的路由 //参数3: 函数体中next()放行,让路由正常的跳转切换 next(false)留在原地不跳转路由, next(pat
2021-11-15 18:54:33 1202
原创 vue-router的使用
yarn add vue-router2.在router/index.js中导入路由import Vue form 'vueimport VueRouter from 'vue-router'3.使用路由插件Vue.use(VueRouter)4.创建路由规则数组const routes = [ { // 这里的名字是我们要在浏览器上输入的路径 path: "/login", name: "login" component:
2021-11-15 18:22:11 785
原创 将ElementUI 添加到项目中
全局引入的方式1.在项目中安装 elementUIyarn add element-ui -S-S: 是--save的简写,表示 这个包是生产依赖, 表示项目上线也要使用这个包。-S: 是可以省略不写的。如果要安装开发依赖,则要加 -D。2.main.js 中引入并注册import Vue from 'vue';import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';
2021-11-03 17:29:44 594
原创 进入vue 项目起步工作
1.yarn global add @vue/cli2.vue create 文件名3.cd 文件名4.yarn serve5.在src并列处新建vue.config.js6.vue.config.js 中配置module.exports = {devServer: { // 自定义服务配置open: true, // 自动打开浏览器port: 3000//将端口号 改为3000},lintOnSave: false //关闭eslint 检查}...
2021-11-03 16:54:11 105
原创 vue 实现 全选功能
全选思路 准备标签,样式,js,准备数据 将数据循环展示在页面上, 在li 里v-for 在全选框 v-model = "isAll" //总的状态 小选框 v-model = "" //单个的状态 小选影响全选 ... 定义计算属性 isAll 统计小选框的状态, every查找数组里不符合条件的,直接返回false ...判断每一个小选框的状态, 只要有一个小选框的状态不为true 就是没有被勾上, 那就返回false , 全选框的状态就是false
2021-10-26 21:03:21 3449 2
原创 vue 指令语法总结
1.v-bind给标签属性设置vue变量的值语法: v-bind:属性名 = "vue变量" 简写 :属性名= "vue变量"2.v-on给标签绑定事件语法: v-on:事件名 = "要执行的 少量 代码"v-on: 事件名 ="methods 中的函数"v-on: 事件名= "methods中的函数 (实参)"简写: @事件名 = "methods 中的函数"3.v-on事件对象vue事件处理函数中, 拿到事件对象 无传参,...
2021-10-20 23:07:55 402
原创 javascript中常用的数组的方法
将数组转换为字符串 toString() 将数组转换为数组值(逗号分隔每一项)的字符串 arr.toString () ["Banana", "Orange", "Apple"] 转换为 Banana,Orange,Apple join() 方法 也可将所有数组元素结合为一个字符串 可以规定分隔符 arr.join(" * ") ["Banana", "Orange", "Apple"] 转换为 Banana * Orange * Apple p..
2021-10-20 21:01:58 192
原创 vue指令
差值表达式在dom 标签中,直接插入内容,又叫声明式渲染 /文本直插语法: {{表达式}}可以将vue 数据变量直接显示在标签内vue 中变量声明在data 函数返回的对象上,用key属性声明MVVM设计模式M: moudle 数据模型 ( data 里定义)V: view 视图 (html 页面)VM: ViewModel 视图模型 ( vue.js 源码 )MVVM 的好处: 减少DOM操作, 提高开发效率MVVM 通过数据双向绑定,让数据自动的双向.
2021-10-18 21:22:27 123
原创 vue/cli 脚手架
@vue/cli 脚手架概念@vue/cli 脚手架 是vue 官方提供的一个全局模块包(得到vue命令)此包用于创建脚手架项目@vue/cli 脚手架 的好处0配置 webpackbabel支持css, less 支持开发服务器支持@vue/cli 的使用@vue/cli 安装yarn global add @vue/cli或者npm install -g @vue/cli查看 vue 脚手架 版本vue -V@vue/cli 创建...
2021-10-18 20:57:08 99
原创 EventLoop 宏任务与微任务
JavaScript 是一门单线程执行的编程语言。也就是说,同一时间只能做一件事情。 单线程执行任务队列的问题: 如果前一个任务非常耗时,则后续的任务就不得不一直等待,从而导致程序假死的问题。2. 同步任务和异步任务 为了防止某个耗时任务导致程序假死的问题,JavaScript 把待执行的任务分为了两类: ① 同步任务(synchronous) ⚫ 又叫做非耗时任务,指的是在主线程上排队执行的那些任务 ⚫ 只有前一个任务执行完毕,才能执行后一个任务 ② 异步任务(asy
2021-10-17 23:46:29 260
原创 使用SQL管理数据库
1.从数据表中 如何使用sql查询数据(select)插入数据(insert into)更新数据(update)删除数据(delete)2. 4种SQL语法where 条件,and 与 or 运算符order by 排序count(*) 函数3. sql 的 select 语句select 语句用于 从表中查询数据, 执行结果被存储在 一个结果表中 (称为 结果集)从from 指定的表中 ,查询所有的数据 * 表示 所有列select * fro...
2021-10-13 00:12:50 306
原创 在项目中操作 MySQL
通过 mysql 模块 链接到 MySQL 数据库 通过 mysql 模块 执行 SQL 语句 1.安装操作 MySQL 数据库的第三方模块 (mysql)在终端命令中 安装mysql 模块 将mysql安装为项目依赖包npm i mysql2.配置mysql 模块在使用 mysql 模块操作 MySQL 数据库之前,必须先对 mysql 模块进行必要的配置导入mysql 模块const mysql = require('mysql')...
2021-10-11 20:27:36 178
原创 初步认识 Express
一. express 概念官方给出的概念:Express 是基于 Node.js 平台,快速、开放、极简的 Web 开发框架。通俗的理解:Express 的作用和 Node.js 内置的 http 模块类似,是专门用来创建 Web 服务器的。Express 的本质:就是一个 npm 上的第三方包,提供了快速创建 Web 服务器的便捷方法。二. Express 能做什么使用Express 我们可以方便, 快速的创建web 网站的服务器(专门对外提供Web网页资源的服务器) 或 API接
2021-10-10 00:01:39 192
原创 echarts的简单使用方法
1. Echarts-介绍ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖矢量图形库 ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。简单点说: 是一个JS插件 性能好可流畅运行PC与移动设备 兼容主流浏览器 提供很多常用图表,且可定制。 折线图、柱状图、散点图..
2021-10-08 20:04:21 227
原创 手把手教你用npm发布包
第一步: 写入自己的开发功能第二步: 查看自己的项目名是否被占用在本地磁盘上创建一个空项目, 取文件夹名为 wuhan13 ,注意先去官网确定一下,到官网输入自己的项目名搜索,查看是否被占用, 如果这个名被占用, 我们是无法向npm 上上传的.检查方式:npm view 包名//这个命令用来查看 某个包的信息//如果返回 404 , 就说明这个项目名在 npm 官网上找不到, 此时你就可以使用.//否则, 说明不可用, 你需要重新修改项目名第三步: 进入要发布的项目.
2021-10-07 20:47:51 673
原创 Node.js 中的模块化
2015年之前,有个痛点是多个js 文件都放在一个html 文件中 ,不能相互引用,模块化解决了这个问题.编程领域中的模块化就是遵守固定的规则,把一个大文件拆分成独立并互相依赖的多个小模块javascript 领域 模块化是一个js 文件中可以引入另一个js文件的数据优点:1.提高了代码的可维护性: 每个模块都是独立的,良好的设计模块尽量与外部的代码撇清关系,以便于独立对其进行改进和维护;2.提高代码的复用性:在开发中,我们经常会复制以前的代码到新的项目中,这时可以使用模块化;...
2021-10-07 00:53:00 273
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人