VueComponent

VueComponent构造函数

是Vue.extend(options)返回值,每次都返回一个全新的 VueComponent(options)构造函数
其中options是 组件配置对象 ---> {data,methods,computed....}

1.定义组件

const School = Vue.extend(options) // 创建school组件

const Student = Vue.extend(options) // 创建student组件

/*
  因为Vue.extend()每次都返回全新的VueComponent,所以school的构造函数 和 student的构造函数 不一样
*/

2.注册组件

// 配置项中:注册组件(局部注册)
components:{
  School:School
/*
  前边的School是组件标签 或者叫 组件名
  后面这个School其实就是Vue.extend(options)的返回值VueComponent(options)

  单文件组件开发中:
    一般后面的School是import过来的组件配置对象,Vue会自动调用Vue.extend(配置对象)生成独一无二的VueComponent构造函数
*/
}

3.使用组件

<template>
  <School/> // 这种自闭合写法需要在脚手架环境下
  <School></School>
/*
  当模板解析时发现你写了School组件标签,那Vue就会自动 School = new VueComponent(options) 创建组件
这个VueComponent(options)就是你注册组件时 组件标签:后的构造函数
*/
</template>

总结
所以不同组件的构造函数VueComponent不一样,这困扰了我很久...

posted @   ycccc丶  阅读(70)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· DeepSeek “源神”启动!「GitHub 热点速览」
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 我与微信审核的“相爱相杀”看个人小程序副业
· C# 集成 DeepSeek 模型实现 AI 私有化(本地部署与 API 调用教程)
· spring官宣接入deepseek,真的太香了~
//背景线条
点击右上角即可分享
微信分享提示