随笔分类 - 1_vue（组件、vue异常、vue事件、vue_resource、mixin、vue结构优化、vue表单等）
摘要：VUE课程 2、VUE最简单实例 一、总结 一句话总结： 1、引入Vue.js：<script src="vue.js"></script> 2、创建Vue对象：var app = new Vue({}); 3、在模板中使用数据：{{ message }} 1、引入Vue.js <script sr
阅读全文
摘要：vue的虚拟dom详解（总结） 一、总结 一句话总结： vue的虚拟dom是将多次dom操作保存在一个js对象（虚拟dom对象）中，然后用这个js对象一次性的去更新dom操作，这样就避免了很多无效的计算 1、DOM和其解析流程？ 创建DOM树——创建StyleRules——创建Render树——布局
阅读全文
摘要：VUE课程参考 4、解决插值表达式闪烁问题 一、总结 一句话总结： vue中解决插值表达式闪烁问题，可以用v-cloak指令，v-cloak在css中用属性选择器设置为display: none; <style> /*属性选择器*/ [v-cloak]{ display: none; } </sty
阅读全文
摘要：VUE课程参考 3、VUE模板语法 一、总结 一句话总结： 在vue模板里面解析数据，可以用大括号表达式，比如{{msg}}，也可以用指令，比如v-html（以html标签方式插入文本），v-text（以文本方式插入文本）等 <div id="app"> <p>{{msg}}</p> <p>{{ms
阅读全文
摘要：VUE课程参考 5、属性绑定v-bind 一、总结 一句话总结： v-bind是vue中绑定属性的指令，v-bind中可以写合法的js表达式，v-bind: 指令可以被简写为 :要绑定的属性 <div id="app"> <!-- <p title="123">{{msg}}</p>--> <!--
阅读全文
摘要：VUE课程参考 6、事件绑定v-on 一、总结 一句话总结： -、vue模板中可以通过v-on来绑定事件，比如click点击事件等等 -、vue实例中定义方法可以写在methods中 <div id="app"> <button v-on:click="showMsg2">vue事件绑定</butt
阅读全文
摘要：VUE课程 1、VUE课程介绍 一、总结 一句话总结： vue.js是目前前端最火的框架，不仅可以开发网站，还可以开发移动app，插件和对应的UI库也都非常多 1、vue特点？ 双向数据绑定：用户不在需要操作dom 虚拟dom：提高渲染性能 组件化开发：便于组件管理和复用，提高开发效率 a、双向数据
阅读全文
摘要：VUE课程参考 2、VUE基本使用 一、总结 一句话总结： 1、引入Vue.js：<script src="vue.js"></script> 2、创建Vue对象：var app = new Vue({}); 3、在模板中使用数据：{{ message }} 1、引入Vue.js <script s
阅读全文
摘要：VUE项目爬坑 6、vuex的真正存在的意义是什么 一、总结 一句话总结： a、【避免低效的数据传递】：当多个组件嵌套的时候，只能父子传递，那么中间的组件只能做传递数据之用，数据不是它用，它却传递数据，这样不合理 b、【管理组件状态】：vuex可以让多个组件很方便的获取和管理状态 1、提交 Muta
阅读全文
摘要：VUE疑难问题 3、vue结构图 一、总结 一句话总结： vuex中的state帮外部组件管理数据，mutations负责修改state中的数据，actions负责执行外部组件的方法并且操作vuex中的mutations来更新state，getters对state数据进行修饰方便外部组件调用 1、v
阅读全文
摘要：VUE实例课程 42、counter实例_vuex_简写 一、总结 一句话总结： 可以用mapState、mapActions、mapGetters等来代替this.$store.state、this.$store.dispatch、this.$store.getters等，这样可以极大的简化代码
阅读全文
摘要：VUE实例课程 40、counter实例 一、总结 一句话总结： counter实例就是用vue组件的方式做的计数小实例，把数据放在组件的data中，computed修饰数据，methods中放操作数据的方法 <template> <div> <div>click {{count}} times,
阅读全文
摘要：VUE实例课程 41、counter实例_vuex 一、总结 一句话总结： 将counter实例中的数据放到vuex中管理起来，组件需要数据的时候就直接从vuex中拿，修改数据的话就就通过actions和mutations来修改vuex中的数据 1、vuex中的state、mutations、act
阅读全文
摘要：npm run dev 和 npm run build 作用和运行过程 一、总结 一句话总结： npm run dev：运行项目 npm run build：发布前的打包项目 二、npm run dev 和 npm run build 作用和运行过程 博客对应课程的视频位置： 1、npm run d
阅读全文
摘要：VUE参考 vue-cli3与2版本的区别 一、总结 一句话总结： *、【还是vue2，webpack4】：vue-cli3是基于webpack4打造，vue-cli 2还是webapck 3 *、【0配置】：vue-cli3的设计原则是“0配置”，移除的配置文件根目录下的，build和config
阅读全文
摘要：vue参考 VUE程序运行过程 一、总结 一句话总结： template->ast(abstract syntax tree)->render->virtual dom->UI 1、runtime-compiler 和 runtime-only 的运行原理（运行过程）？ runtime-compil
阅读全文
摘要：vue参考 vue-cli 3.*初始化项目 一、总结 一句话总结： 直接去看官方文档就好：vue create hello-world创建一个新项目，运行npm run serve 1、vue-cli 3.*运行项目？ 运行项目的话直接看package.json里面的内容，所以根据package.
阅读全文
摘要：VUE项目爬坑 5、vue单页面项目发布 一、总结 一句话总结： 可以直接放到apache或者其它的服务器里面（就以静态网站的方式放置），很简单的 1、弹性布局做两端对齐用到的特别多？ justify-content: space-between; 2、购物车的数据如何做持久化？ 购物车的数据可以加
阅读全文
摘要：VUE项目爬坑 4、vuex使用注意 一、总结 一句话总结： 1、【修改数据mutations】：state中的数据，不能直接修改，如果想要修改，必须通过 mutations 2、【获取数据this.$store.state.***】：如果组件想要直接 从 state 上获取数据： 需要 this.
阅读全文
摘要：VUE项目爬坑 3、vue route的编程式导航 一、总结 一句话总结： router.push(location, onComplete?, onAbort?)：router.push('home') 编程式的导航 除了使用 <router-link> 创建 a 标签来定义导航链接，我们还可以借
阅读全文
浙公网安备 33010602011771号