如何使用vue组件

目录

1:组件之间的父子关系

2:使用组件的三个步骤

3:components组件的是私有子组件

4:在main.js文件中使用Vue.component全局注册组件


1:组件之间的父子关系

一:首先封装好的组件是不存在任何的关系的,每个封装好的组件彼此都是独立的。

二:在使用组件的过程中根据嵌套关系,可能形成兄弟关系或者父子关系如图所示(APP这个组件中用到了组件Left和组件Right,Left和Right组件与App组件就形成了父子关系,Left和Right组件就是兄弟关系)。

 

2:使用组件的三个步骤

一:在哪些组件中需要用到哪些组件就使用import语法导入需要的组件

二:使用components节点声明组件

注意:

全写形式:(key:value)

简写形式:key和value一致,一个名字声明即可

三:按照标签的形式使用刚才注册的组件

3:components组件的是私有子组件

例如:组件A中的components节点下注册了B组件,那么B组件只能在A组件中进行使用,不能在C组件中进行使用,除非C组件的components节点下声明了B组件,可以使用B组件。

4:在main.js文件中使用Vue.component全局注册组件

场景:频繁使用的组件可以注册到main.js文件中进行全局注册。

在全局中注册的组件,其他的组件使用这个全局组件可直接使用注册时的名称作为标签,全局组件不可在组件中使用自己。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/192232.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

强化学习简明教程

到目前为止,我们主要关注监督学习问题(主要是分类)。 在监督学习中,我们得到某种由输入/输出对组成的训练数据,目标是能够在学习模型后根据一些新输入来预测输出。 例如,我们之前研究过 MNIST 的卷积神经网…

阅读笔记|A Survey of Large Language Models

阅读笔记 模型选择:是否一定要选择参数量巨大的模型?如果需要更好的泛化能力,用于处理非单一的任务,例如对话,则可用选更大的模型;而对于单一明确的任务,则不一定越大越好,参数小一…

BearPi Std 板从入门到放弃 - 1 引气入体篇

安装相关开发工具 Keil MDK 工具下载 略, 自行体会 Keil 芯片支持包下载 Keil 包 网址 https://www.keil.com/pack 此处下载的是STM32L4xx的支持包 https://www.keil.com/pack/Keil.STM32L4xx_DFP.2.6.2.pack STM32CubeMX 下载与包下载 i. 下载(需要使用用户&…

DouyinAPI接口系列丨Douyin商品详情数据接口丨Douyin视频详情数据接口

抖音商品详情API是抖音开放平台提供的一套API接口,用于获取商品详情信息。通过该API,开发者可以获取到商品的详细信息,包括商品ID、名称、描述、价格、销量、评价等信息。 在使用抖音商品详情API之前,需要先注册并登录抖音开放平…

fl studio21.2最新汉化中文完整版网盘下载

fl studio 21中文版是Image-Line公司继20版本之后更新的水果音乐制作软件,很多用户不太理解,为什么新版本不叫fl studio 21或fl studio2024,非得直接跳到21.2版本,其实该版本是为了纪念该公司22周年,所以该版本也是推出…

系统监控:使用日志文件 journalctl的使用

journalctl 显示最近登录的: 上面有最近登录的时间,和系统操作 几十年来,Linux日志记录一直由syslogd守护进程管理。Syslogd将收集系统处理和应用程序发送到/dev/log伪设备的日志消息。然后,它会将消息定向到/var/log/目录中适当…

MacDroid Pro for Mac – 安卓设备文件传输助手,实现无缝连接与传输!

想要在Mac电脑上轻松管理和传输您的安卓设备文件吗?MacDroid Pro for Mac 是您的最佳选择!这款强大的文件传输助手可以让您在Mac上与安卓设备之间实现快速、方便的文件传输。 MacDroid Pro for Mac 提供了简单易用的界面,让您能够直接在Mac上…

人工智能和网络安全:坏与好

人工智能似乎可以并且已经被用来帮助网络犯罪和网络攻击的各个方面。 人工智能可以用来令人信服地模仿真人的声音。人工智能工具可以帮助诈骗者制作更好、语法正确的网络钓鱼消息(而糟糕的语法往往会暴露出漏洞),并将其翻译成多种语言&…

字符函数 和 字符串函数

今天我打算介绍一些字符函数和字符串函数,有一些字符串函数我实现了模拟,但文章中没有放出来,如果需要的欢迎来到我的gitee里面拿取(在test.c11-23里面) 这是我的gitee:小汐 (lhysxx) - Gitee.com 字符函数 1. islow…

matlab操作方法(一)——向量及其操作

1.向量及其操作 matlab是英文Matrix Laboratory(矩阵实验室)的简称,是基于矩阵运算的操作环境。matlab中的所有数据都是以矩阵或多维数组的形式存储的。向量和标量是矩阵的两种特殊形式 向量是指单行或者单列的矩阵,它是构成矩阵…

C语言易错知识点八(结构体)

结构体 世间万物,上至飞禽,下至走兽,全都知道一件事:三个臭皮匠,顶个诸葛亮。(假的)即使是处于人类前沿的编程语言也知道要把数据联合在一起,于是便有了数组,结构体&…

org.springframework.jdbc.datasource.lookup.AbstractRoutingDataSource

DynamicDataSource-CSDN博客 /** Copyright 2002-2020 the original author or authors.** Licensed under the Apache License, Version 2.0 (the "License");* you may not use this file except in compliance with the License.* You may obtain a copy of the L…

鸿蒙工具DevEco Studio调试Build task failed. Open the Run window to view details.

DevEco Studio 预览代码时候出现的问题 1.进入设置 2.打开设置,构建,执行,部署下面的Hvigor, 把构建守护进程关掉就行。 然后重启启动一下就好了

Redis SDS 源码

底层数据结构的好处: 杜绝缓冲区溢出。减少修改字符串长度时所需的内存重分配次数。二进制安全。兼容部分C字符串函数。 常用命令: set key value、get key 等 应用场景:共享 session、分布式锁,计数器、限流。 1、给char*定义…

【重点】【哈希】128.最长连续序列

题目 思路&#xff1a;https://leetcode.cn/problems/longest-consecutive-sequence/solutions/2362995/javapython3cha-xi-biao-ding-wei-mei-ge-l-xk4c/?envTypestudy-plan-v2&envIdtop-100-liked class Solution {public int longestConsecutive(int[] nums) {Set<…

<JavaEE> volatile关键字 -- 保证内存可见性、禁止指令重排序

目录 一、内存可见性 1.1 Java内存模型(JMM) 1.2 内存可见性演示 二、指令重排序 三、关键字 volatile 一、内存可见性 1.1 Java内存模型(JMM) 1&#xff09;什么是Java内存模型&#xff08;JMM&#xff09;&#xff1f;Java内存模型即Java Memory Model&#xff0c;简…

如何使用注解实现接口的幂等性校验

如何使用注解实现接口的幂等性校验 背景什么是幂等性为什么要实现幂等性校验如何实现接口的幂等性校验1. 数据库唯一主键2. 数据库乐观锁3. 防重 Token 令牌4. redis 如何将这几种方式都组装到一起结语 背景 最近在小组同学卷的受不了的情况下&#xff0c;我决定换一个方向卷去…

基于景区智慧灯杆、智能指路牌基础设施的景区建设应用

智慧景区是指运用现代信息技术手段&#xff0c;将景区内的资源、服务、管理等进行数字化、网络化和智能化整合&#xff0c;打造出高效便捷、安全舒适、互动体验和可持续发展的景区。智慧景区可以从以下几个方面进行体现&#xff1a; 智慧导览&#xff1a;通过使用智能化的导览…

二分查找:LeetCode2035:将数组分成两个数组并最小化数组和的差

本文涉及的基础知识点 二分查找算法合集 作者推荐 动态规划LeetCode2552&#xff1a;优化了6版的1324模式 题目 给你一个长度为 2 * n 的整数数组。你需要将 nums 分成 两个 长度为 n 的数组&#xff0c;分别求出两个数组的和&#xff0c;并 最小化 两个数组和之 差的绝对…

Screenshot To Code

序言 对于GPT-4我只是一个门外汉&#xff0c;至于我为什么要了解screenshot to code&#xff0c;只是因为我想知道&#xff0c;在我不懂前端设计的情况下&#xff0c;能不能通过一些工具辅助自己做一些简单的前端界面设计。如果你想通过此文深刻了解GPT-4或者该开源项目&#…