- 博客(36)
- 收藏
- 关注
RSS订阅原创 限制el-input 只能输入包含小数点的数字
限制el-input 只能输入包含小数点的数字<el-input v-model.trim="form[item.propName]" onkeyup="value=value.replace(/[^\d^\.]+/g,'')" :placeholder="item.placeholder" clearable size="small" >
2022-04-22 16:36:39
510
转载 Vue生命周期钩子函数hook解析
声明：文章摘自https://www.cnblogs.com/goloving/p/13879157.htmlVue的各生命周期，其实就是Vue开发者规定的一些hook，和git里面规定的hook类似，你只要往hook里面填自定义内容，它就可以执行。如vue实例里的beforeCreate,created,mounted等，都是hook。简单来说，hook其实就是一种回调函数，只不过这种回调函数的名称已经被固定，内容不固定，且函数名称作为了一个接口被暴露出去。这样也更好了进行了抽象化：将经常变化的内.
2022-03-02 10:25:16
6891
原创 面试题（不定期更新）
说几条写JavaScript的基本规范不要在同一行声明多个变量请使用===/!==来比较true/false或者数值使用对象字面量替代new Array这种形式不要使用全局函数Switch语句必须带有default分支If语句必须使用大括号for-in循环中的变量 应该使用var关键字明确限定作用域，从而避免作用域污染请描述一下cookies，sessionStorage和localStorage的区别？cookie是网站为了标示用户身份而储存在用户本地终端（Client Side）上
2022-02-23 19:24:45
152
原创 一些简单常用网站
1.echarts渐变色的各种方式https://www.cnblogs.com/liuwei54/p/9962182.html2.git 配置usernamehttps://blog.youkuaiyun.com/qq_44409163/article/details/1139336303.and-vue分页表格https://www.cnblogs.com/theblogs/p/14738545.html4.最新数组方法https://www.cnblogs.com/sqh17/p/8529401.h
2021-12-03 17:25:25
880
原创 二十.导航守卫，滚动位置记录函数
导航守卫 、 导航钩子函数滚动位置导航守卫 、 导航钩子函数监听甚至 拦截 路由变化全局守卫 （拦截所有的路由）// 全局前置 守卫router.beforeEach((to,from,next)=>{ // to 目标路由 // from 从哪来路由 // next 拦截器 不调用next()路由无法进入,next参数同router-link to属性的值，重定向地址 next()})// 全局后置守卫router.afterEach((to,from)=.
2020-11-22 18:31:52
243
原创 十九.vue中路由基本方法
文章目录vue路由基本使用路由query传参路由params传参 (常用⭐)⭐children路由嵌套vue路由基本使用1.在new路由对象的时候，可以为构造函数，传递一个配置对象。//创建一个路由对象，当导入 vue-router 包之后，在window 全局对象中，就有了一个路由的构造函数。叫做VueRouter.1.1.route这个配置对象中的routes表示路由匹配规则的意思，不能修改且必传//每个路由规则，都是一个对象，这个规则对象，有两个必须属性。//属性一：path，表示监听
2020-11-19 21:25:46
626
原创 十八.vue中axios库
文章目录axios ajax库 （vue+axios react+axios angular+axios）axios ajax库 （vue+axios react+axios angular+axios）axios 是一个 封装好的 第三方ajax请求的库 特点：支持restfulapi 支持promise 解决回到地狱 支持ajax请求拦截vue-resource 停止维护了 ，官网不推荐使用get请求： axios.get('url?param
2020-11-19 21:24:57
193
原创 十七.vue中请求ajax
目录vue中请求ajaxvue中请求ajaxfetch如何使用： "key=v&key2=v" fetch(url,{ headers:{ "token":localStorage.getItem('token'), "content-type":"apllication-xxx-urlencoded" }, method:"GET/POST", data:{ } }).then(function(res){ return res.json()
2020-11-19 21:24:08
168
原创 十六.混入与vue自定义指令
文章目录mixinvue自定义指令mixin当多个组件有相同的部分(可以是属性,数据,方法…)，定义一个混入，在混入中定义公共的部分，然后注入到需要使用的组件中①const mixin={};②使用:mixins=[mixin]const mixin = { data(){ return { name:"123", } } }//子组件使用const title1 =
2020-11-18 19:21:19
211
原创 十五.vue动画与过滤器
文章目录transition动画transition组件 控制 单组件（标签）状态切换transition结合动画过滤器transition动画transition组件 控制 单组件（标签）状态切换注意：有一种情况可以同时写多个元素，就是使用v-if v-else-if v-else等控制前提：永远不可能同时出现两个如果 想要控制 列表动画 （同时控制多个元素）使用 transition-group组件 用法相同1.给需要过渡的box使用transition容器包裹，v-if是必须的&
2020-11-18 19:20:18
173
原创 十四.Vue实例的生命周期
文章目录vue实例的生命周期1.什么是生命周期?2.生命周期钩子 = 生命周期函数 = 生命周期事件3.主要的生命周期函数分类:创建期间的生命周期函数运行期间的生命周期函数销毁期间的生命周期函数:组件再一次激活时被触发(keep-alive直接包裹需要保留的内容)vue实例的生命周期1.什么是生命周期?从Vue实例创建，运行，到销毁期间，总是伴随着各种各样的事件，这些事件统称为生命周期！2.生命周期钩子 = 生命周期函数 = 生命周期事件3.主要的生命周期函数分类:创建期间的生命周期函数·b
2020-11-16 19:25:12
131
原创 十三.插槽
插槽插槽:子组件中的提供给父组件使用的一个占位符，用 表示，父组件可以在这个占位符中填充任何模板代码，如 HTML、组件等，填充的内容会替换子组件的标签。解决问题：多个组件使用同一个子组件，需要传入或修改数据时，需要利用插槽。1.子组件设置插槽 2.父组件填充内容, 父组件通过 v-slot:[name] 的方式指定到对应的插槽中,父组件填充内容时，是可以根据这个名字把内容填充到对应插槽中的子组件设置插槽:1.使用<slot></slot> 默认插槽2.设置指定的需要使
2020-11-16 19:24:08
127
原创 十二.vue组件
组件组件组件通信父--子 props通信子向父通信 自定义事件兄弟组件通信 自定义事件 事件中心总线 （event bus）ref组件通信 （⭐⭐⭐）$parent $childrenprovide inject组件mvvm 数据驱动 组件化组件：网页上组成部分（预定义组件、自定义组件）组件语法:组件也是Vue的实例（new Vue 他有的属性 组件都有） // 全局组件（挂载到Vue上，可以在任意组件以及实例的模板中使用） Vue.component(组件名,{ t
2020-11-13 15:46:53
121
原创 十一.vue计算属性-处理data
computed ： Vue提供的一个配置项注意: 当data中的数据发生变化,页面中的指令和表达式会重新计算, 有时候不相关数据变化会导致一直重新计算,所以这里引出了计算属性如何使用？computed 和 data同级，计算属性写在computed中；写起来像方法；用起来像属性。特点（注意点）：1）一定要有返回值。2）可以使用data中的已知值。3）只要跟计算属性相关的数据发生了变化，计算属性就会重新计算，不相关的属性无论如何变化，都不会导致计算属性变化。4）计算属性名不能
2020-11-12 20:16:06
3700
原创 十.vue侦听器
侦听器监听 实例上的 某个属性的值得变化const vm = new Vue({ el:"#app", data:{ msg:"", obj:{ a:10, b:20 } }, watch:{ msg(newVal, oldVal){ console.log(`值变化了，新值是${newVal},旧值是${oldVal}`) // 监听的是非对象的数据 直接在watch中新增一个同名的方法即可 },
2020-11-12 20:15:23
125
原创 九.动态生成元素的获取方法
动态生成元素的获取当数据改变（改变数据时同步） 视图刷新（更新dom，异步 中间要通知观察者，调用render生成虚拟dom，比较两个虚拟dom用diff算法，在更新）所有 我们无法 立即获取，数据改变后生成最新的domvue 提供了一个watcher(观察每一次的dom更新，更新完成后，回调触发，在回调中获取最新的dom)this.$nextTick(()=>{ <!-- 在这里获取最新的dom -->})Vue.nextTick(()=>{ <!--
2020-11-12 20:14:25
402
原创 八.vue获取dom元素
vue获取dom元素方法一:直接给相应的元素加id,然后再document.getElementById(“id”);获取，然后设置相应属性或样式方法二：使用ref,给相应的元素加ref=“name” 然后再this.$refs.name获取到该元素例<div ref="tet" id="tet">我是tet</div>const vm = new Vue({ el:"#app", mounted(){ document.querySelector
2020-11-12 20:13:39
1108
原创 七.MVVM问题
es6之扩展运算符 三个点（…）对象的扩展运算符：常用于浅克隆理解对象的扩展运算符其实很简单，只要记住一句话就可以：对象中的扩展运算符(…)用于取出参数对象中的所有可遍历属性，拷贝到当前对象之中let bar = { a: 1, b: 2 };let baz = { ...bar }; // { a: 1, b: 2 }上述方法实际上等价于:let bar = { a: 1, b: 2 };let baz = Object.assign({}, bar); // { a: 1, b:
2020-11-12 18:33:48
133
原创 六.todolist练习
todolist笔记<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href=" "> <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3
2020-11-12 10:38:07
229
1
原创 五.解决页面刷新刚打开时闪烁问题
解决 页面刷新 刚打开时 闪烁问题问题原因：代码执行顺序从上往下，在 vue实例还未创建，vue还没有作用html上，此时我们模板 只是单纯字符串实例作用到html，模板开始解析style [v-cloak]{ display:none; }<div v-cloak> {{ m sg }} </div>在 vue 实例还未作用到html上，此时v-cloak只是一个普通的自定义属性[v-cloak]属性选择器可以选中这个元素，此时隐藏，当vue实
2020-11-12 10:36:43
634
1
原创 四.MVVM原理
MVVM原理es5 Object.defineProperty(obj,‘属性’,{value:1,set:function(){},get:function(){}})’’<script> var obj = { a:10 } var a = 10 // Object.defineProperty() 可以定义没有属性或者存在属性 Object.defineProperty(obj,'a',{ get:functi
2020-11-12 10:35:58
107
原创 三.vue简易计数器
/*注意:data中数据一定要使用this指向*/<style> #app{ padding: 20px; background-color: pink; }</style><body> <div id="app"> <input type="button" value="-" @click = "sub"> <span>{{n}}&l
2020-11-12 10:35:15
120
原创 二.vue基本语句
文章目录其他常用指令条件渲染 v-if v-else-if v-elseelsev-else-if 使用场景不多条件与循环例子列表渲染 循环:class:style回顾：mvvmconst vm = new Vue({ el: '#app', //挂载vue data: { // 放数据 data属性 会直接挂载到实例上 msg: 'xxx' }, methods: { // 用于放置 实例方法 直接挂载到实例上 changeMsg (){ }
2020-11-10 19:01:17
372
原创 一 . vue入门
文章目录什么是vuevue雏形模板 {{ }}外部挂载vue指令什么是vuehttps://cn.vuejs.org/是 MVVM js 渐进式 视图层 框架mvvm m model 数据 v view 视图 mv vm 数据改变 视图会自动刷新（vm Vue实例驱动刷新） 命令式 将程序 每一个 运行步骤 写出来 程序运行 声明式 告诉 计算机 我要干什么 （中间怎么做 不管）一切以数据为核心、尽量不要操作dom(由数据驱动视图)渐进式 v
2020-11-09 15:32:46
104
原创 layui模块化开发
模块化开发步骤layui模块化开发1.安装express生成器 自动生成mvs代码2.在目录中 npm i 下载项目依赖,并在package.json中修改nodemon3.在www中设置端口4.routes中设置路由，并在app.js中删除引入的路由,创建自己的路由5.模板要传入public中6.数据库的连接需要创建models7.创建cate.js定义schema （集合） 结构并导出layui模块化开发1.安装express生成器 自动生成mvs代码安装npm i express-gener
2020-11-06 21:34:35
631
原创 mongoose操作mongodb
mongoose操作mongodbmongoose 库 操作mongodbmongoose 库 操作mongodb好处：解决原生mongo 对于 字段不做任何验证问题安装npm i mongoose -S连接 model connect.js 连接代码 直接在app.js中引入即可 const mongoose = require('mongoose'); mongoose.connect('mongodb://localhost/demo',{
2020-11-06 15:46:47
235
原创 multer中间件上传文件
multer中间件上传文件上传图片中间件 multer2.html中form表单中传输文件一定要加入enctype="multipart/formdata"实例封装upload上传图片中间件 multer//1.基本语法npm i multer -Sconst multer = require('multer')const storage = multer.diskStorage({ destination: function (req, file, cb) { cb(null
2020-11-05 21:42:19
230
原创 mongobdb操作数据库
mongodb安装 `mongodb`mongodbmongodb 原生sql 语句robot 3T mongodb可视化使用 InteliShell 进行增删改查操作查看文档1.固值寻找2.范值寻找3.AND和OR寻找ANDORAND和OR等结合插入文档更新文档1.update()方法2.save()方法删除文档安装 mongodb 点击安装 注意 mongodb compass 千万不要勾选 如何启动mongodb 1，假设你安装在 D:mongo 1，直接进入这
2020-11-05 20:24:34
322
原创 nodejs express模块
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录nodejs express实际操作nodemon 解决服务器热加载问题postman 用于 做接口测试设置路由 请求路由 携带参数 （参数解析）后端路由 解析参数解析get请求传参解析post请求传参post 请求 body 请求参数 express库默认没有这个功能解决办法:body-parser例:中间件 渐进式框架（核心包 只有基础功能 核心包 体积特别小）后端返回给前端 格式 规范 restfulApiMVC路由中
2020-11-03 20:44:56
814
1
原创 jsonp跨域请求vip联想词
jsonp跨域请求联想词<body> <input type="text" id="inp"> <ul id="ul"></ul></body><script type="text/javascript">/* 1.获取输入框的值; 2.将值传出发送jsonp请求 ①查找地址 ②处理地址 ③动态添加 3.接受请求并处理*/ var inp = docu
2020-11-03 14:13:59
252
原创 nodejs使用http模块爬某糖图片
http爬某糖页面图片//1.将模块导入const https = require('https');const cheerio = require("cheerio");const fs = require('fs');// 2.利用http模块的get请求https.get("https://www.duitang.com/category/?cat=beauty",res=>{ //定义一个空数组准备接收爬到的图片 let arr = []; // 空字符串
2020-11-02 21:09:31
307
2
原创 git基础操作
Git本地使用git分支冲突git拉取远程分支到本地git本地（除主分支）上传并创建到新分支(需同名)Git本地使用git下载安装，检测是否安装成功：git --version首先要在被管理的文件夹中进行初始化，才能在这个文件夹中使用git命令管理：git init初始化后，会出现一个隐藏的文件夹.git，此时代表当前这个文件夹及其以下内容都被git管理了。git管理文件夹的时候将管理过程分为3个区域：工作区：自己写的源文件暂存区：将要保存的文件，暂时存在暂存区历史区：生成一个.
2020-11-02 17:06:15
114
原创 url模块
url模块## url模块组件 协议名 主机 端口 path search (包含query k=v&k2=v2) hash （#hash） parse() format() //例//1.接收urlconst url = require('url')console.log(url.parse("http://www.abc.com/a/b/c?name=小明&gender=男#hash"));...
2020-11-02 16:45:45
160
原创 path模块与全局变量
path模块与全局变量path模块nodejs 内置的全局变量path模块path.join([...path])// 方法 可以有多个参数，或者没有参数 // 将 方法的 参数 拼接成 路径片段path.resolve([...path])// 解析 路径参数 解析成 绝对路径注意： /写在路径前面代表 根目录 有服务器（软件）： /根目录就是服务器监听目录 没有服务器： 当前文件所在的盘const** path = require('path')//
2020-11-02 16:33:58
247
原创 常用fs模块
fs几个重要模块fs模块**⭐⭐⭐fs读取文件**fs写入文件fs追加内容fs删除文件fs监视文件fs模块⭐⭐⭐fs读取文件const fs = fs.readFile(path[,options],callback)****callback:errdataconst fs = require('fs')同步读取let data = fs.readFileSync("./demo/a.html","utf8")console.log(data);异步读取fs.readFile(".
2020-11-02 16:25:30
832
1
原创 nodejs基础巩固
node 对于前端意义node：基于 chrome v8引擎 js 运行环境（独立安装的js运行环境）浏览器 解析 网页 内核内容排版引擎 解析 html/cssjs解释引擎 解析jsnvm安装以及使用nvm ls 列举当前可用的node列表nvm install 6.14.4nvm use 版本复习npmnode是js 运行环境（独立安装 安装到 服务器上）node就可以操作 服务器 相关 资源（数据库、当做服务器软件、操作硬件）node可以取代java php做 后端服务
2020-11-02 11:59:56
126
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人