- 博客(24)
- 收藏
- 关注
RSS订阅原创 git的一些简单命令
git init 查看文件的状态 git restore . 还原文件 git status 查看文件的状态 git log 查看提交日志 .gitignore git会忽略该文件夹中的内容 git log --pretty = oneline 查看历史记录 git reset --hard 根据指定的ID退回到指定的版本 git reflog --pretty = oneline 查看操作命令的历史 git checkout 分支名称 从主分支切换到这分支上 git checkout -
2021-07-20 00:48:42
140
1
原创 如何使用vue中的依赖注入
在使用vue的时候会出现这种情况：组件A里面嵌套了组件B，组件B里面又嵌套了组件C，然后由于一些需要，我们需要在组件C里面访问组件A的数据或者方法。一般我们首先想到的方法是：1.将A的数据通过父传子给B，然后B在传给C，C接收到之后在调用。2.C组件通过子传父$emit方法传递给B，由B在传递给A，A接收到之后在处理。3.将数据保存到vuex中使用。针对这种多层组件嵌套的问题，vue提供了一种解决方案 -----依赖注入([provide/inject]),依赖注入就是由祖先组件通过
2021-07-19 00:21:17
944
原创 wacth监听事件的使用
1.监听器(watch)1.watch监听器主要是用来监听变量的变化，然后通过对变量的监听，在钩子函数中写入相应的操作。2.watch监听器会监听data中数据的变化，只要一变化，就能够执行相应的逻辑3.监听的数据名放到这里面作为函数名，这个函数里面有两个参数，一个是新值，一个是旧值2.普通监听注意事项：当值第一次绑定的时候，不会执行监听函数<input type="text" v-model="age"/> //监听 age值发生变化时触发watch: {
2021-07-19 00:17:38
873
原创 如何让vuex数据持久化
1.为什么要让vuex数据持久化在使用vuex的时候，会发现刷新页面之后state中存储的数据会被重置，因为刷新浏览器的时候会导致整个页面重新加载，vuex的state也会全部重新加载，所以为了防止这类情况的发生，我们会将vuex中的数据进行本地存储，防止页面刷新丢失vuex中的数据。2.如何将vuex中的数据持久化1.我们需要安装一个插件，我们需要借助这个vuex-persistedstate插件进行持久化// 安装依赖包npm install vuex-persistedstate
2021-07-19 00:15:04
2769
原创 简单封装一个EventBus
参考自https://blog.csdn.net/weixin_43213137/article/details/113857167封装函数//eventBus.js文件function EventBus () { //定义一个用来存储回调的对象 let eventList = {} /** * 定义on方法 * eventName 是传递进来的自定义名称 * callback 是回调函数 * 将传递进来的以键值对的形式存储到eventList中 *
2021-07-19 00:13:29
302
原创 什么是Vue事件总线（EventBus）
1.事件总线的介绍vue组件非常常见的有父子组件通信，兄弟组件通信。而父子组件通信就很简单，父组件会通过 props 传数据给子组件，当子组件有事情要告诉父组件时会通过 $emit 事件告诉父组件。而eventBus又称事件总线。在Vue中可以使用eventBus作为沟通桥梁的概念，就像是所有组件共用相同的事件中心，可以向该中心注册发送事件或接收事件，所以组件都可以上下平行的通知其他组件。事件总线也是一种通信方式，只不过它的功能比较强大，不在局限于父传子或兄弟组件之间通信，它可以跨组件通信，通过事件
2021-07-19 00:11:13
10004
原创 如何让分页的序号延续上一页的序号
利用计算属性实现方法 <el-table-column type="index" :index="indexMethod" label="序号" width="50" /> export default { data() { return { pageParams: { page: 1, // 第几页(当前页数) pagesize: 2// 每页两条数据 }, } } } //计算
2021-07-19 00:07:44
746
2
原创 .sync修饰符
什么是sync修饰符在vue中说到数据绑定的时候第一时间想到的就是v-model，但是因为每个组件只能绑定一个v-model，如果其他props也要实现双向绑定的效果该怎么办呢？ 简单的方法是子组件向父组件发送一个事件，父组件监听该事件，然后更新props，.sync就是这种方法的简化。sync修饰符的作用1.当我们需要在子组件中改变props接收的值并且需要同步到父组件中的时候需要用到.sync修饰符。2.如果一个组件的多个props都要实现双向绑定，只需要每个props加sync修饰符。
2021-07-19 00:05:58
3145
原创 Vue项目中用Export2Excel导出Excel表
1.在项目src文件夹下新建文件夹vendor，将Export2Excel.js 文件放入此文件夹下。下载Export2Excel.js文件下载地址：Export2Excel.js2.安装依赖npm install -S file-savernpm install -S xlsxnpm install -D script-loader代码 formatData(list) { // map是用来替换导出的Excel表格的头部标题 const map = {
2021-07-19 00:03:30
479
1
原创 vue表单的自定义校验规则
1.给表单添加ref与:rules属性对form表单的数据进行校验时，需要在el-form标签加上ref和:rules属性，并且在每个el-form-item标签里定义prop属性，prop属性对应:rules里面的每项规则，例如： <el-form ref="addData" :model="addData" label-width="100px" :rules="rules"> <el-form-item label="标识名称" prop="name">
2021-07-19 00:01:50
5197
1
原创 this的指向和如何改变this的指向
一.要想理解this指向的问题就得知道：1.this永远指向一个对象2.this指向的这个对象的函数调用者是谁 (箭头函数除外)箭头函数的this是指向离它最近一级的父级函数普通函数调用，此时 this 指向 window，默认写法可以省略windowfunction a(){ console.log(this); //Window}a();对象方法调用， 此时 this 指向调用次方法的对象 var obj = { fn: function ()
2021-07-19 00:00:05
137
原创 vue项目中如何导入Excel文件
导入就是通过input的file属性来实现1.安装依赖包npm install -S xlsx2.代码//做一些格式转换transExcel(results) { const userRelations = { '入职日期': 'timeOfEntry', '手机号': 'mobile', '姓名': 'username', '转正日期': 'correctionTime', '工号': 'wo
2021-07-18 23:52:51
290
原创 Vue配置代理解决跨域问题
使用vue框架开发也会遇到跨域的问题，在vue中可以是用proxyTable解决跨域问题。那么proxyTable是什么呢，他的原理又是什么？因为浏览器有同源策略的原因是禁止跨域的，但是服务端不禁止，我们可以在前端服务和后端接口之间搭建一个中间代理服务器，让他的端口、域名、协议都保持一致，这时由于中间服务器和前端的服务器之间没有同源策略的限制可以直接发送请求，而后端接口与中间服务器也没有限制，这是我们可以将请求发送到中间服务器，由它转发给后端接口，这样就可以拿到数据。但是这种方法只能解决开发环境
2021-07-18 23:50:53
548
原创 Object.keys() 和 Object.values()的使用
1.如果传入的是一个对象Object.keys() 将对象的属性名转化为数组Object.values() 将对象的属性值转化为数组 const obj = { name: { userName: '小花', age: '11' }, name1: { userName: '小蓝', age:
2021-07-18 23:49:13
809
原创 Vue中的keep-alive有什么用
keep-alive是Vue提供的一种切换组件时，将其包裹组件进行缓存，使其不会被销毁，避免组件被多次重新渲染，(简单理解页面1跳转到页面2，然后页面2后退到页面1，页面1直接从缓存中加载出来，提高性能 )而且当使用keep-alive时，组件的生命周期中会多出两个钩子函数 actived 和 deactived ，activated是在组件被激活时调用，而deactivated是在组件被停用时调用。它还有两个属性：include --- 可以是字符串或正则表达式，只有符...
2021-06-20 16:14:46
220
原创 防抖和节流的简单理解
在开发页面的时候经常会绑定一些不停触发的事件，比如 input 输入事件和 scroll 滚动事件，这些事件，只要触发事件就会在一段时间内连续触发，导致页面负载家中，影响体验，所以我们不希望这些事件在一段时间内不停的做一些重复而且毫无意义的操作，这时我们需要用 防抖和节流限制这些事件的调用频率，并且不影响体验。防抖(debounce)当持续触发事件时，一定时间段内没有再触发事件，事件处理函数才会执行一次，如果设定的时间到来之前，又一次触发了事件，就重新开始延时。...
2021-06-20 16:12:43
112
原创 使用拦截器解决axios返回双层data的问题
每次使用axios发送请求返回的数据都是双层data，需要response.data.data才能拿到需要的数据，并不能直接获取到我们需要的有效数据。
2021-06-20 16:09:09
2653
原创 Object.keys() 和 Object.values()的使用
1.如果传入的是一个对象Object.keys() 将对象的属性名转化为数组Object.values() 将对象的属性值转化为数组
2021-06-20 16:06:00
227
原创 Vue中的计算属性
在模板中使用插值表达式时，可以书写简单的表达式，但是一旦表达式比较繁琐时就不太合适了，这是就可以用计算属性，计算属性就是在Vue实例中的computed中
2021-06-11 20:18:21
525
原创 Vue中async和await的使用
在使用vue中如果返回的值是一个Promise对象，那我们就可以用async和await简化这段代码async是作为一个关键词放在函数的最前面，表示这个函数是异步函数
2021-06-06 22:27:58
15636
原创 使用Vue写移动端时解决REM适配问题与AXIOS的封装
如果要写的项目是一个移动端时，用户需要使用手机访问，手机屏幕大小不一，所以需要去适配各种大小不同的手机，这个时候就需要使用REM适配技术
2021-06-04 21:08:47
327
原创 Vuex-的使用和介绍
什么是Vuex？1.vuex也是一种通信方案2.Vuex是一个官方的，用来集中式维护公共数据（状态）3.vuex就好比是一个库管，仓库内的所有公共数据的修改和调用，vuex都可以追踪到Vuex可以解决哪些问题？ 可以解决非父子级关系组件之间的通信问题如何在Vue项目使用Vuex？1.如果是在旧项目中使用Vuex需要分为三个步骤1.1.首先需要安装。因为vuex是一个独立的包，所以首先需要安装1.2.配置创建Vuex.store实例|--src ...
2021-06-03 21:57:51
159
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人