随笔分类 - 前端VUE
摘要：有五种，分别是 State、 Getter、Mutation 、Action、 Modulestate => 基本数据(数据源存放地)getters => 从基本数据派生出来的数据mutations => 提交更改数据的方法，同步！actions => 像一个装饰器，包裹mutations，使之可以
阅读全文
摘要：三种方式第一种：vue异步组件技术 异步加载，vue-router配置路由 , 使用vue的异步组件技术 , 可以实现按需加载 .但是,这种情况下一个组件生成一个js文件。第二种：路由懒加载(使用import)。第三种：webpack提供的require.ensure()，vue-router配置路
阅读全文
摘要：总共分为8个阶段创建前/后，载入前/后，更新前/后，销毁前/后。创建前/后： 在beforeCreated阶段，vue实例的挂载元素$el和**数据对象**data都为undefined，还未初始化。在created阶段，vue实例的数据对象data有了，$el还没有。载入前/后：在beforeMo
阅读全文
摘要：使用vue开发时，在vue初始化之前，由于div是不归vue管的，所以我们写的代码在还没有解析的情况下会容易出现花屏现象，看到类似于{{message}}的字样，虽然一般情况下这个时间很短暂，但是我们还是有必要让解决这个问题的。首先：在css里加上[v-cloak] {display: none;}
阅读全文
摘要：用法：query要用path来引入，params要用name来引入，接收参数都是类似的，分别是this.$route.query.name和this.$route.params.name。url地址显示：query更加类似于我们ajax中get传参，params则类似于post，说的再简单一点，前者
阅读全文
摘要：从浏览器中创建XMLHttpRequests；node.js创建http请求；支持Promise API；拦截请求和响应；转换请求数据和响应数据；取消请求；自动换成json。axios中的发送字段的参数是data跟params两个，两者的区别在于params是跟请求地址一起发送的，data的作为一个
阅读全文
摘要：假如父组件需要在子组件内放一些DOM，那么这些DOM是显示、不显示、在哪个地方显示、如何显示，就是slot分发负责的活。
阅读全文
摘要：使用location.href='/url'来跳转，简单方便，但是刷新了页面；使用history.pushState('/url')，无刷新页面，静态跳转；引进router，然后使用router.push('/url')来跳转，使用了diff算法，实现了按需加载，减少了dom的消耗。其实使用rout
阅读全文
摘要：.stop：等同于JavaScript中的event.stopPropagation()，防止事件冒泡；.prevent：等同于JavaScript中的event.preventDefault()，防止执行预设的行为（如果事件可取消，则取消该事件，而不停止事件的进一步传播）；.capture：与事件
阅读全文
摘要：相同点：assets和static两个都是存放静态资源文件。项目中所需要的资源文件图片，字体图标，样式文件等都可以放在这两个文件下，这是相同点不相同点：assets中存放的静态资源文件在项目打包时，也就是运行npm run build时会将assets中放置的静态资源文件进行打包上传，所谓打包简单点
阅读全文
摘要：单页面应用（SPA），通俗一点说就是指只有一个主页面的应用，浏览器一开始要加载所有必须的 html, js, css。所有的页面内容都包含在这个所谓的主页面中。但在写的时候，还是会分开写（页面片段），然后在交互的时候由路由程序动态载入，单页面的页面跳转，仅刷新局部资源。多应用于pc端。多页面（MPA
阅读全文
摘要：vue 双向数据绑定是通过 数据劫持 结合 发布订阅模式的方式来实现的， 也就是说数据和视图同步，数据发生变化，视图跟着变化，视图变化，数据也随之发生改变；核心：关于VUE双向数据绑定，其核心是 Object.defineProperty()方法。
阅读全文
摘要：因为JavaScript的特性所导致，在component中，data必须以函数的形式存在，不可以是对象。 组建中的data写成一个函数，数据以函数返回值的形式定义，这样每次复用组件的时候，都会返回一份新的data，相当于每个组件实例都有自己私有的数据空间，它们只负责各自维护的数据，不会造成混乱。而
阅读全文
摘要：当你修改了data的值然后马上获取这个dom元素的值，是不能获取到更新后的值，你需要使用$nextTick这个回调，让修改后的data值渲染更新到dom元素之后在获取，才能成功。
阅读全文
摘要：computed: 当一个属性受多个属性影响的时候就需要用到computed 最典型的栗子： 购物车商品结算的时候watch: 当一条数据影响多条数据的时候就需要用watch 栗子：搜索数据
阅读全文
摘要：v-model用于表单数据的双向绑定，其实它就是一个语法糖，这个背后就做了两个操作：v-bind绑定一个value属性；v-on指令给当前元素绑定input事件。
阅读全文
摘要：vue文件的一个加载器，将template/js/style转换成js模块。用途：js可以写es6、style样式可以scss或less、template可以加jade等
阅读全文
摘要：共同点：都能控制元素的显示和隐藏；不同点：实现本质方法不同，v-show本质就是通过控制css中的display设置为none，控制隐藏，只会编译一次；v-if是动态的向DOM树内添加或者删除DOM元素，若初始值为false，就不会编译了。而且v-if不停的销毁和创建比较消耗性能。总结：如果要频繁切
阅读全文
摘要：答：轻量级框架：只关注视图层，是一个构建数据的视图集合，大小只有几十kb；简单易学：国人开发，中文文档，不存在语言障碍 ，易于理解和学习；双向数据绑定：保留了angular的特点，在数据操作方面更为简单；组件化：保留了react的优点，实现了html的封装和重用，在构建单页面应用方面有着独特的优势；
阅读全文
