![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue系列
大个子小可爱
这个作者很懒,什么都没留下…
展开
-
基础知识汇总
1. vue生命周期钩子函数 生命周期包括8个阶段:创建前/后(beforeCreate/created), 载入前/后(beforeMount/mounted),更新前/后(beforeUpdate/updated),销毁前/销毁后(beforeDestroy/destroyed)。 第一次页面加载时会触发 beforeCreate/created, beforeMount/mounted ...原创 2019-10-10 09:36:57 · 70 阅读 · 0 评论 -
问题记录
关于img图片展示问题的解决办法: 把图片放在src同级的static文件夹下。 把图片放在cdn上,把网络地址存在imgUrl里,然后直接去展示。 图片放在assets文件夹,然后在data里面require进图片,然后去展示即可 img: require("../assets/images/guide-bg1.png") ...原创 2019-10-10 10:04:39 · 193 阅读 · 0 评论 -
vue-列表过渡
列表交错过渡 使用场景:通过Input 搜索关键字后,下方结果集带有自上而下展开与自下而上收缩的动画效果。 列表过渡,使用<transition-group> 组件 ,可以通过tag 特性更换为指定的真实元素。 内部元素总是需要 提供唯一的 key 属性值 安装 velocity-animate 安装包 <transition-group class= "m...原创 2019-10-10 10:02:38 · 518 阅读 · 0 评论 -
过渡&&动画总结
一. vue的过渡与动画 Vue 在插入、更新或者移除 DOM 时,提供多种不同方式的应用过渡效果。过渡效果的应用可以通过不同方式实现: 在CSS过渡和动画中自动应用class 在过渡钩子函数中使用JavaScript直接操作dom 配合第三方css动画库:Animate.css 或者第三方javascript动画库:Velocity 上面三种方式其实主要就是两种:一个是利用CSS过渡或者...原创 2019-10-10 10:01:27 · 191 阅读 · 0 评论 -
vuex使用方法简述
下载vuex npm install vuex --save module分模块开发 将整个store分割成模块module,每个模块有自己的state,mutation,getter,action。 新建store目录,在主文件index.js引入vue,vuex。 store目录结构 >store >modules -app.js -user.js ...原创 2019-10-10 09:58:14 · 218 阅读 · 0 评论 -
vue组件间传值
一. 子组件向父组件传值 - $emit 发射事件 子组件$emit发射事件A this.$emit(event,...argument); /* * event: 要触发的事件 * argument: 传给父组件的参数 */ 例子:this.$emit('emitEvent',data,'lalala'); 父组件通过事件名A接收 <p...原创 2019-10-10 09:56:42 · 106 阅读 · 0 评论 -
vue路由跳转权限拦截判断
1. 全局钩子函数: beforeEach函数有三个参数: to:router即将进入的路由对象 from:当前导航即将离开的路由 next:Function,进行管道中的一个钩子,如果执行完了,则导航的状态就是 confirmed (确认的);否则为false,终止导航。 afterEach函数不用传next( )函数。 Vue.beforeEach(function(to,fo...原创 2019-10-10 09:48:16 · 496 阅读 · 0 评论 -
vue过滤器filter
1. 过滤器filter可使用在花括号{{ } 和v-bind表达式两个地方;放在管道 |的后面。 <!-- 在双花括号中 --> {{ message | capitalize }} <!-- 在 `v-bind` 中 --> <div v-bind:id="rawId | formatId"></div> 2. 过滤器表达式总是接收之前表达式...原创 2019-10-10 09:47:00 · 455 阅读 · 1 评论 -
vue-router基础知识
1. 动态路由匹配 路径参数以 : 标记,参数值会被设置到this.$route.params。 使用路由参数,例如:‘/user/foo’到‘/user/bar’,组件实例会被复用,需要watch监听$route对象。 to.name 匹配的是路由的name值。 watch: { '$route' (to, from) { if (to.name ...原创 2019-10-10 09:45:22 · 63 阅读 · 0 评论 -
vue-cli脚手架安装
1. vue-cli 全局安装 npm install -g vue-cli 2. 初始化项目 vue init webpack 文件名 3. 启动项目 npm start 链接:https://cli.vuejs.org/zh/guide/creating-a-project.html#vue-create原创 2019-10-10 09:43:48 · 68 阅读 · 0 评论 -
element-ui
1. 表格自定义radio单选框 label=“scope.$index”:为label变量动态赋值当前行的index值;否则会触发所有radio的选中。 radio选择框后面动态生成的index值,可以使用添加 $nbsp; 清除。 <el-table-column align="center" > <template slot-scope="scope" &g...原创 2019-10-10 09:38:02 · 110 阅读 · 0 评论 -
关于vuex的简单认识
1. Vue是什么? Vuex 是一个专门为 Vue.js 应用程序开发的状态管理模式. 它 采用集中式存储管理应用的所有组件的状态, 并以相应的规则保证状态以一种可预测的方式发生变化. 2. 什么是状态管理模式? 状态管理应用分以下 3 个部分: state: 驱动应用的数据源; view: 以声明方式将 state 映射到视图; actions: 响应在 view 上用户输入导致的状态变化....原创 2019-10-11 10:46:22 · 155 阅读 · 0 评论