Vue组件
- vue组件：封装前端vue特效代码，便于引用
- 全局组件
- 全局组件通过Vue.component在script标签中注册
- 参数1：指定组件名称
- 参数2：{}对象，{}内通过template指定组件要加载的内容
- 全局组件调用：在div标签中通过组件名称进行调用
- 局部组件
- 局部组件定义：var 组件名称={}对象，{}内通过template指定组件要加载的内容
- 在全局组件中定义components属性，components:{}将局部组件注册到全局组件中，进行组件的嵌套
- 在全局组件的template属性中调用局部组件
- 局部组件定义在全局组件之前，才能调用
- 组件中的数据绑定data，data属性对应的是一个函数方法，函数中返回绑定的数据
- 在template中对指定的数据进行调用
- 组件传值
- 父组件通过props属性给子组件传值
- 子组件中定义props:['用来接收父组件值的变量']
- 子组件template中调用该变量{{变量}}
- 全局组件中调用子组件时，通过v-bind:变量='父组件要传的值'指定父组件的传值
- 子组件通过$emit给父组件传值
- 子组件template中绑定触发事件<button v-on:click="isupload"> 上传</button>
- 子组件定义 methods：{isupload：function（）{this.$emit('事件'，’数据‘)}}，子组件上的点击事件成功后，通过 $emit 将事件和数据传递给父组件
- 父组件的子组件标签中绑定监听事件（处理子组件的事件）
- 父组件定义监听子组件事件的方法 |
|
收藏
淘帖
踩
