随笔分类 - 1_vue（组件、vue异常、vue事件、vue_resource、mixin、vue结构优化、vue表单等）
摘要：VUE项目爬坑 2、在webpack中配置.vue组件页面的解析 一、总结 一句话总结： 1、运行`cnpm i vue -S`将vue安装为运行依赖； 2、运行`cnpm i vue-loader vue-template-compiler -D`将解析转换vue的包安装为开发依赖； 3、运行`c
阅读全文
摘要：VUE项目爬坑 1、 一、总结 一句话总结： 还是要多看视频，而且系统且轻便，比参照博客效果好 1、vue上一开始就要获取ajax数据的的函数（比如获取轮播图数据）应该放在哪个生命周期函数中？ 放在created中 2、在组件中，使用v-for循环的话，一定要指定key？ 在使用v-for的时候，尽
阅读全文
摘要：Vuejs中关于computed、methods、watch的区别 一、总结 一句话总结： a、【计算属性用于简易模板中的复杂表达式】、【缓存】、【属性】：computed是在HTML DOM加载后马上执行的，如赋值； b、【methods触发条件】：methods则必须要有一定的触发条件才能执行，
阅读全文
摘要：VUE参考 watch、computed和methods之间的对比 一、总结 一句话总结： computed：【缓存】 【属性】：属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算。主要当作属性来使用； methods：【业务逻辑】：方法表示一个具体的操作，主要书写业务逻辑； watch：【键
阅读全文
摘要：VUE实例课程 30、watch监听路由地址的改变 一、总结 一句话总结： 直接使用watch属性监听$route.path的改变即可，例如$route.path是'/login'表示登录页面 watch: { // this.$route.path '$route.path': function
阅读全文
摘要：VUE参考 为路由添加动画 一、总结 一句话总结： 直接把router-view放到transition中去，设置动画的方式和给普通标签设置动画的方式一样 <style> .v-enter, .v-leave-to { opacity: 0; transform: translateX(140px)
阅读全文
摘要：VUE参考 设置router-link激活样式 一、总结 一句话总结： 设置router-link激活时候的样式，直接设置 router-link-active 设置router-link激活时候的样式，直接设置 router-link-active .router-link-active { co
阅读全文
摘要：VUE参考 redirect重定向 一、总结 一句话总结： redirect重定向：{ path: '/', redirect: '/login' } // 2. 创建一个路由对象， 当 导入 vue-router 包之后，在 window 全局对象中，就有了一个 路由的构造函数，叫做 VueRou
阅读全文
摘要：VUE参考 router-link 一、总结 一句话总结： router-link会被解析成a标签，在to属性里面写链接，不用加#号 <!-- <a href="#/login">登录</a> --> <!-- <a href="#/register">注册</a> --> <!-- router-
阅读全文
摘要：VUE参考 路由基本使用 一、总结 一句话总结： 1、引入vue-router：<script src="./lib/vue-router-3.0.1.js"></script> 2、创建一个路由对象：let routerObj = new VueRouter({}); 3、在vm实例上注册路由：r
阅读全文
摘要：VUE参考 前端路由 一、总结 一句话总结： 在单页面应用程序中，这种通过hash(#号)改变来切换页面的方式，称作前端路由 1、前端路由的原理是什么？ *、通过URL中的hash(#号)来实现不同页面之间的切换 *、HTTP请求中不会包含hash相关的内容 前端路由：对于单页面应用程序来说，主要通
阅读全文
摘要：VUE参考 ref获取组件 一、总结 一句话总结： ref属性可以给组件使用，获取的组件可以调用组件的方法，比如 this.$refs.mylogin.show() <div id="app"> <input type="button" value="获取元素" @click="getElement
阅读全文
摘要：VUE参考 父组件向子组件传递方法 一、总结 一句话总结： 1、在使用组件的位置传递方法：父组件中的show方法，子组件通过func使用：<com2 @func="show"></com2> 2、在子组件中通过$emit注册方法func，this.sonmsg是传递的参数：this.$emit('f
阅读全文
摘要：VUE参考 父组件向子组件传递数据 一、总结 一句话总结： 1、在使用组件的位置通过v-bind向子组件传递数据：<com1 v-bind:parentmsg="msg"></com1> 2、在子组件的props中注册父组件传过来的数据：props: ['parentmsg'] 3、子组件中使用传递
阅读全文
摘要：VUE参考 组件复习 一、总结 一句话总结： 组件本身是一个对象，我们需要给组件取名，才能用 // 通过 对象 字面量的形式， 定义了一个 组件模板对象 var login = { template: '<h1>1234</h1>' } // 通过 Vue.component 把 组件模板对象，注册
阅读全文
摘要：VUE实例课程 8、列表动画 一、总结 一句话总结： 列表动画 也就是对列表使用动画，需要transition-group、v-move等知识点配合使用，列表动画记得对v-for设置 :key 属性 <style> li { border: 1px dashed #999; margin: 5px;
阅读全文
摘要：VUE实例课程 7、动画钩子函数 一、总结 一句话总结： 动画钩子函数也就是用函数（用js控制css）来操作动画，动画钩子函数中可以更加方便的操作动画，比如只实现半场动画，像物品添加到购物车的动画 <div id="app"> <!-- 1. 使用 transition 元素把 小球包裹起来 -->
阅读全文
摘要：VUE实例课程 6、使用第三方类库实现动画 一、总结 一句话总结： 可以使用第三方类库实现动画，比如animate.css，可以分别给enter-active-class和leave-active-class设置类，可以:duration设置动画持续时间 <!-- :duration="毫秒值" 可
阅读全文
摘要：VUE参考 组件切换动画 一、总结 一句话总结： 组件切换动画 直接把组件放到<transition>标签中即可 <!-- 通过 mode 属性,设置组件切换时候的 模式 --> <transition mode="out-in"> <component :is="comName"></compon
阅读全文
摘要：VUE参考 组件切换方式 一、总结 一句话总结： 可以用flag标志来标记组价的显示和隐藏，比如点击登录，flag为true，登录组件显示，点击注册，flag按钮为false，注册按钮显示 用component的is占位符，is 属性可以用来指定要展示的组件的名称：<component :is="c
阅读全文
浙公网安备 33010602011771号