本文最后更新于 976 天前,其中的信息可能已经有所发展或是发生改变。
components:组件
.vue文件就是一个组件
一个组件有下面这三部分组成
<template>
</template>
<script>
</script>
<style>
</style>
组件中的js
export default{
name : ”,
data(){
return {
定义数据
},
}
有import就一定有export default.
import ‘名称’ from 路径 (父组件中使用)
定义组件的方式(CDN)
方式1:先创建组件构造器,然后由组件构造器创建组件
Vue.extend({})
Vue.component(组件名,构造器名)
方式2:直接创建组件
Vue.component(组件名,{组件内容})
组件的分类
全局组件 Vue.component
局部组件 在实例中定义 components:{}
引用模板
将组件内容放到模板<template>中并引用,必须有且只有一个根元素
组件名 : {
template : “与上面的id相对应”
}
动态调用组件:
<keep-alive>
<component :is=”变量”></component> 变量的值决定使用哪个模板
</keep-alive>[/danger]
组件间数据传递
父子组件
在一个组件内部定义另一个组件,称为父子组件
子组件只能在父组件内部使用
默认情况下,子组件无法访问父组件中的数据,每个组件实例的作用域是独立的