Vue组件-04-vue组件md

最新推荐文章于 2024-05-21 17:51:13 发布

无敌最硬朗

最新推荐文章于 2024-05-21 17:51:13 发布

阅读量245

点赞数 1

分类专栏： vue初级文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/m0_62782366/article/details/126285395

版权

本文介绍了Vue组件的基础，包括组件的体验、特点、全局与局部组件的注册、组件嵌套，以及组件间的通信，特别是通过props进行父子组件传值的方法。

摘要由CSDN通过智能技术生成

基础-组件-组件体验

场景: 重复的页面结构,数据,逻辑都可以抽提成一个组件

特点 简单高效不重复

基础-组件-组件特点

组件和实例相似之处: data/methods/computed/watch 等一应俱全

注意：

data和Vue实例的区别为

组件中data为一个函数且需要返回一个对象

组件没有el选项

template 代表其**页面结构** (有且只要一个根元素)

每个组件都是**独立**的运行作用域、数据、逻辑没有任何关联

基础-组件-全局组件

全局和局部: 注册方式不同应用范围不同

注意: 注意命名规范

路径: 实现一个全局组件

定义一个全局组件

写入组件选项

使用组件

 // 注册组件名称 推荐 小写字母 加横向的结构
      Vue.component("content-a", {
   
        template: `<div>
        {
    {count}} 
        </div>`,
        data() {
   
          return {
   
            count: 1
          };
        }
      });
		<content-a