(创作不易,感谢有你,你的支持,就是我前行的最大动力,如果看完对你有帮助,请留下您的足迹)

目录
组件的三大组成部分
注意点说明

组件的样式冲突 scoped
data 是一个函数
<template>
  <div class="base-count">
    <button @click="count--">-</button>
    <span>{{ count }}</span>
    <button @click="count++">+</button>
  </div>
</template>
<script>
export default {
  data() {
    console.log('函数执行了')
    return {
      count: 100,
    }
  },
}
</script>
<style>
.base-count {
  margin: 20px;
}
</style> 
<template>
  <div class="app">
    <baseCount></baseCount>
  </div>
</template>
<script>
import baseCount from './components/BaseCount'
export default {
  components: {
    baseCount,
  },
}
</script>
<style>
</style>
 
组件通信
什么是组件通信
不同的组件关系 和 组件通信方案分类
组件通信解决方案:










