Vue3组件化开发(一)

Vue3组件化开发(一)

    • 组件的拆分和嵌套
    • 组件的CSS作用域问题
    • 组件通信(父传子)
      • `props`的数组用法
      • `props`的对象用法
    • 非prop的Attribute的传递
      • 子组件有根组件包裹
      • 禁用Attribute继承
      • 子组件无根组件包裹,且有多个元素
    • 组件通信(子传父)
      • `emits`的数组写法
      • `emits`的对象写法

组件的拆分和嵌套

这个我也不知从何写起,就这样拆分,引用。

细节补充在引入其他组件时,加后缀。虽然不加后缀,vue-cli会帮我们处理好,但是不能帮我们快速定位到导入的文件内部。ctrl + 鼠标点击进入文件。

组件的CSS作用域问题

Vue提供了 scoped 属性,它的实际实现是给本组件内的每个标签添加上了一个相同的属性,并在设置样式时加入了 属性选择器。若子组件有,那么根元素将会有俩个vue设置的属性。

Vue3组件化开发(一)_第1张图片

Vue3组件化开发(一)_第2张图片

组件通信(父传子)

props的数组用法

若没有 v-bind

你可能感兴趣的:(Vue2&Vue3,vue,vue.js,vue3组件化,vue组件间通讯)