vue
小铃铛的打怪之路
这个作者很懒,什么都没留下…
展开
-
Vue的一些总结(二)组件通信
文章目录组件通信父传子props子传父$emit$children / $parentprovide/injectref/$refseventBusvuex各个模块localStorage / sessionStorage$attrs / $listeners总结组件通信在知道组件之间是怎么通信的之前,我们先要知道组件之间都存在什么样的关系,对症下药才是王道。在这里A-B A-C B-D C-E之间是父子关系B-C是兄弟关系A-D A-E是隔代关系,也就是爷爷和孙子的关系D-E是堂兄原创 2020-08-05 21:37:50 · 225 阅读 · 0 评论 -
Vue的一些总结~(一)计算属性/双向绑定/生命周期/vue-router
文章目录computed和watch的区别computed和watch的区别计算属性( computed)对于任何复杂逻辑,你都应当使用计算属性。计算属性是基于它们响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才重新求值。官方文档的例子<div id="example"> <p>Original message: "{{ message }}"</p> <p>Computed reversed message: "{{ rever原创 2020-08-02 13:42:12 · 405 阅读 · 0 评论 -
自己动手封装Toast插件
先上一张效果图:普通的封装方式我们第一步先要封装这么一个(Toast)插件这里我把它封装在了src/components/common/toast/Toast.vue在需要调用的地方引入Toast.vue组件//Toast.vue<template> <div class="toast" v-show="show"> {{message}} </div></template><script>原创 2020-07-28 14:01:07 · 309 阅读 · 2 评论 -
几分钟搞懂Vuex(State,Mutations,Actions)
文章目录StateGettersMutationActions这是Vuex官方给出的图片,看起来有点不好理解,上详解!!!!开始介绍之前,我们需要将Vuex挂载到Vue实例上面,这样我们才能在Vue的所有组件中都可以使用这些数据,这里我们store文件夹下面的index.js存放我们的Vuex代码。记得在入口文件main.js里面导入store对象State暂时可以将他看作是data中的属性,也就是我们当前的状态。state里面的这些属性都会被加入到响应式系统里面,而响应式系统会监听属性的变原创 2020-07-26 11:10:42 · 1839 阅读 · 0 评论 -
Vue2.0和3.0的响应式原理
vue3.0在数据的响应式上无疑做了很大的优化,性能得到大大提升。虽然vue3.0还没有正式发布,但是各大公众号已经闹得不亦说乎。我们都知道vue2的响应式原理的实现依赖的是Object.defineProperty这个API,用它来为要实现响应式的数据设置getter和setter方法。如果数据多时就要循环遍历。循环遍历就会降低性能。所以vue3.0就摒弃了这个方法,改为使用ES6中的proxy来实现。而这个方法没有shim,不兼容低版本浏览器。所以vue3.0彻底摒弃了它们。下面我就用Vue原创 2020-07-19 23:04:53 · 484 阅读 · 0 评论 -
Vue基础知识Vue.extend详解
Vue.extend 属于 Vue 的全局 API,但是在实际业务开发中我们很少使用,因为使用extend写法比常用的Vue。components写法要繁琐一些。但是在一些独立组件开发场景中,Vue.extend + $mount 这对组合是我们需要去关注的。学习开始之前我们先看一眼官方文档是怎么介绍的Vue.extend(options)我这里直接截图过来了在vue项目中,我们有了初始化的根实例之后,页面之间都是通过router进行管理,组件也是通过import进行局部注册,相比于extend轻原创 2020-07-18 15:59:45 · 2704 阅读 · 1 评论