随笔分类 - Vue
摘要：有时候父组件触发的实际需要修改子组件内的data数据，这时候请给子组件绑定ref属性，在父组件触发时间内修改子组件的变量 <template> <div class="page"> <Header :page-type="getType(searchKey.tab)" ref="head" :fix
阅读全文
摘要：主要思路就是获取每次滚动时候滚动条距离顶部的距离，然后触发事件。注意：如果scrollTop一直是0的话，请查阅是否有元素设置了overfolw: hidden，还有一个就是离开页面或者组件注销的时候解绑scroll事件，否则会出现多次触发事件。 在生命周期mounted中进行监听滚动： mount
阅读全文
摘要：首先可以先去看一下Vue官方的规范：Vue.js 风格指南 ##Vue 开发规范目录及说明 本文档为前端 vue 开发规范 规范目的 命名规范 结构化规范 注释规范 编码规范 CSS 规范 ##规范目的 为提高团队协作效率 便于后台人员添加功能及前端后期优化维护 输出高质量的文档 ##命名规范 为了
阅读全文
摘要：由于Vue在开发时对路由支持的不足，于是官方补充了vue-router插件。vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则是路径之间的切换，实际上就是组件的切换。路由就是
阅读全文
摘要：①监听页面滚动 在生命周期mounted中进行监听滚动： mounted () { window.addEventListener('scroll', this.scrollToTop) }, 在方法中定义监听滚动执行的方法： scrollToTop() { var scrollTop = wind
阅读全文
摘要：安装就不过多讲解了，请移步至 axios 学习文档 仔细看看文档，就知道axios 是一个基于 promise 的 HTTP 库，axios并没有install 方法，所以是不能使用vue.use()方法的。☞查看 Vue 插件 那么难道我们要在每个文件都要来引用一次axios吗？多繁琐！！！解决方
阅读全文
摘要：Loadsh 常用方法总结 ##安装 npm i lodash -S ##方法一 全局使用 在main.js引入 import _ from 'lodash' Vue.prototype._ = _ 使用 this._.debounce(this.handleClick,1000,false) ##
阅读全文
摘要：vue-router路由属性配置说明 export default new Router({ mode: 'history', //路由模式，取值为history与hash base: '/', //打包路径，默认为/，可以修改 routes: [ { path: string, //路径 ccom
阅读全文
摘要：现在每个项目都可能会用到sass了，但是怎么在vue项目里引入一个variables.scss变量文件供整个项目使用呢？本文将为一些刚用vue的新人讲解一下。 本文环境 Vue 2.x + Vue-CLI 3.x 方法一：增加vue.config.js配置 要在项目下的 vue.config.js
阅读全文
摘要：vue 2.x Vue-CLI 3.x 日常采坑之设置alias别名、background引入图片 的问题,看准环境，切勿根据本文盲目修改代码 在某一个vue文件引入变量文件写法： 可以使用路径别名写法，哪个文件需要变量，就需要手动引入才可以使用，每个文件都手动引入太麻烦了！！！ <template
阅读全文
摘要：第一种 :title="`字符串${xx}`" 第二种 :title="'字符串' + xx"
阅读全文
摘要：##Vue的生命周期及其相应的三个阶段解读 1、生命周期的概念： vue中的生命周期指的是 组件 从创建到销毁一个过程，在这个过程中，我们在每一个特定的阶段会触发一些方法（ 这些方法具备一些功能），我们给这些方法起了个名字叫做 生命周期钩子函数（组件钩子 ）。 2、为什么要学习生命周期？ 因
阅读全文
摘要：element-ui 报错 Invalid prop: custom validator check failed for prop "index" 使用element-ui的菜单，中有一个index的属性，如果index的值从后端传入是个int类型的值时，则可能出现这个错误。 使用toString
阅读全文
摘要：我们在写vue项目的时候都会给组件命名，这里的name非必选项。 export default { name:'xxx' } **官方文档指出：name只有作为组件选项时起作用。 ** 常见的几种用途 1.组件递归操作 vue允许组件模板调用自身，这在日常需求中也时有出现，此时我们就可以根据组件的n
阅读全文
摘要：Vue.js 官网 Vue.js 开发的标准工具 Vue CLI 配置参考 搭建Vue项目 使用Vue官方推荐的Vue CLI工具，Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，提供： 通过 @vue/cli 实现的交互式的项目脚手架。 通过 @vue/cli + @vue/cl
阅读全文
