Vue3---基础2(component)

主要讲解 component 的创建

以及vue插件的安装

Vue.js Devtools

        为谷歌浏览器的Vue插件,可以在调试工具内查看组件的数据等

      下载

        有两种下载方式

        1. 谷歌应用商店

        

        

        打开Chrome应用商店去下载,这个方法需要魔法

        

        2. 极简插件

        极简插件官网_Chrome插件下载_Chrome浏览器应用商店

        搜索 Vue

        

        这个就为我们需要的插件

        

        推荐下载,下载后解压

        

        把后缀为 crx 的文件拖动到扩展应用内

        

        添加扩展应用,就可以使用该插件了

        

components 文件

        components文件为放置需要复用的组件的文件

      新建组件

                在src内创建 components 文件夹

                在文件夹内新创建 abc.vue 文件

                在 abc 文件内写入需要复用的内容

                

      使用组件

                在要使用的页面内先引用

import person from './components/person.vue'

                在 components 内注册

export default {
    name:'App', // 组件名
    components: {person} // 注册组件
}

                在结构上使用该组件

<template>
    <div class="app">
        <h1>hello,world!</h1>
        <person></person>
    </div>
</template>

相关推荐

  1. Vue2-3Vue基本使用

    2024-04-10 13:38:03       79 阅读
  2. Vue.component v2v3注册(局部与全局)组件使用详解

    2024-04-10 13:38:03       30 阅读
  3. Vue3---基础4(响应式数据) Vue2

    2024-04-10 13:38:03       34 阅读
  4. Vue3 中使用 styled-components

    2024-04-10 13:38:03       31 阅读
  5. Vue3使用component动态展示组件

    2024-04-10 13:38:03       39 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-04-10 13:38:03       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-04-10 13:38:03       100 阅读
  3. 在Django里面运行非项目文件

    2024-04-10 13:38:03       82 阅读
  4. Python语言-面向对象

    2024-04-10 13:38:03       91 阅读

热门阅读

  1. 计算机的各种转换

    2024-04-10 13:38:03       22 阅读
  2. SpringBoot中ApplicationEvent的用法

    2024-04-10 13:38:03       38 阅读
  3. 要有大不了被裁了的思想

    2024-04-10 13:38:03       38 阅读
  4. 常见Linux嵌入式C语言笔试面试题

    2024-04-10 13:38:03       31 阅读
  5. tp6 mongodb简单的增删改查

    2024-04-10 13:38:03       31 阅读