随笔分类 - Vue 组件化开发
摘要:组件自定义事件之 .sync 修饰符 在没有 .sync 修饰符之前我们要对一个 prop 进行双向绑定。 可直接复制以下代码查看 <!--父组件模板--> <div id="app"> {{father}} <button @click="btnClick">父组件按钮</button> <son
阅读全文
摘要:插槽 slot slot的基本使用 在真正学习插槽之前,我们需要先理解一个概念:编译作用域 官方给出了一条准则:父组件模板的所有东西都会在父级作用域内编译;子组件模板的所有东西都会在子级作用域内编译。 在子组件中,使用特殊的元素 按钮 哈哈哈 hehe lala xixi 我是组件 我是组件,哈哈哈
阅读全文
摘要:父子组件的通信 首先,我们指导正常情况下子组件是不能访问父组件或者Vue实例的数据的 但是,在开发中,往往一些数据确实需要从上层传递到下层 比如在一个页面中,我们从服务器请求到了很多的数据。 其中一部分数据,并非是我们整个页面的大组件来展示的,而是需要下面的子组件进行展示。 这个时候,并不会让子组件
阅读全文
摘要:组件数据存放 组件可以访问Vue实例数据吗? 组件是一个单独功能模块的封装: 这个模块有属于自己的HTML模板,也应该有属性自己的数据data。 组件中的数据是保存在哪里呢?顶层的Vue实例中吗? 我们先来测试一下,组件中能不能直接访问Vue实例中的data 我们用组件里的message去访问定义在
阅读全文
摘要:注册组件 注册组件的基本步骤 组件的使用分成三个步骤: 创建组件构造器:调用Vue.extend()方法 注册组件:调用Vue.component()方法 使用组件:在Vue实例的作用范围内 我们来看看通过代码如何注册组件 查看运行结果: 和直接使用一个div看起来并没有什么区别。 但是我们可以设想
阅读全文
摘要:组件化开发 什么是组件化 如果我们将一个页面中所有的处理逻辑全部放在一起,处理起来就会变得非常复杂,而且不利于后续的管理以及扩展。 但如果,我们讲一个页面拆分成一个个小的功能块,每个功能块完成属于自己这部分独立的功能,那么之后整个页面的管理和维护就变得非常容易了 组件化思想 组件化是Vue.js中的
阅读全文