【Vue3重点概念总结和实践七】（封装获取鼠标坐标组合函数 / 在具有CSS作用域的Vue单文件组件设置全局CSS样式:global() / 使用 h 渲染函数来实现一个组件）

目录

1、封装获取鼠标坐标组合函数

2、在具有CSS作用域的Vue单文件组件设置全局CSS样式

3、渲染函数

4、Vue3 + Vue-cli (1) 基础篇

5、Vue3+ Vue-cli (2) 组件篇

---

1、封装获取鼠标坐标组合函数

原题： 

https://github.com/webfansplz/vuejs-challenges/blob/main/questions/25-useMouse/README.zh-CN.md

答案：

 

2、在具有CSS作用域的Vue单文件组件设置全局CSS样式

原题： 

vuejs-challenges/questions/27-global-css/README.zh-CN.md at main · webfansplz/vuejs-challenges · GitHub

答案：

全局选择器​：

如果想让其中一个样式规则应用到全局，比起另外创建一个 

文档：

单文件组件 CSS 功能 | Vue.js

3、渲染函数

原题： 

使用 h 渲染函数来实现一个组件。注意: 确保参数被正确传递、事件被正常触发和插槽内容正常渲染

https://github.com/webfansplz/vuejs-challenges/blob/main/questions/218-h-render-function/README.zh-CN.md

答案：

实现①：

实现②：

MyButton.vue组件：


父组件：

文档：

渲染函数 & JSX | Vue.js

4、Vue3 + Vue-cli (1) 基础篇

Vue3 + Vue-cli (1) 基础篇_vue3 vue-cli_小草莓蹦蹦跳的博客-CSDN博客

5、Vue3+ Vue-cli (2) 组件篇

Vue3+ Vue-cli (2) 组件篇_vue3 text root nodes_小草莓蹦蹦跳的博客-CSDN博客