vue组件基础知识点

最新推荐文章于 2023-06-23 20:27:08 发布

box--小盒

最新推荐文章于 2023-06-23 20:27:08 发布

阅读量178

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/Asher_lm/article/details/128242444

版权

本文深入探讨Vue.js组件系统的基础知识，包括组件的创建、使用、 props传递数据、事件处理及组件通信等核心概念，旨在帮助开发者更好地理解和应用Vue.js进行前端开发。

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

vue组件template
例子：
<div id="app">
    <v-tab></v-tab>
</div>
<!--
    template 因为不是html的标准标签，
    是Vue的组件专用模板，template里面的内容并不会渲染在页面上，
    只会在Dom树中出现，
    在html文件中，template仅作为Vue的组件模板使用，
    只有在绑定了该模板，并且在vue实例挂载的Dom里面使用，
    才会出现在视图上；
 
     浏览器：
            1.表现（html）
            2.结构（css）
            3.行为（js）
-->

<template id="tem">
    <div>
        {
  {cat}}----{
  {play}}---{
  {some}}
    </div>
<template>
<!--引入vue文件-->
<script src="vue.js"></script>
<script>
Vue.component("vTab",{
    //template："选择器"
    template:'#tem',
    props:{
        cat:{
            type:String,
            default:()=>{
                return'猫'
            }
        }，
        pla