【Vue】我的第一个组件

文章目录

  • 项目简介


项目简介

  1. 项目根目录中的index.html是项目的入口文件
    在这里插入图片描述

  2. 加载index.html,vite解析。指向的src下的ts文件或者js文件
    在这里插入图片描述

  3. 最后通过vue3的createApp函数创建一个应用,并挂载到指定div下
    在这里插入图片描述

  4. App.vue结构说明
    特别注意:script脚本内,推荐使用setup语法糖(组合式API)。使用ts语法
    使用setup语法糖优势有:
    1.更少的样板内容,更简洁的代码。
    2.能够使用纯 TypeScript 声明 props 和自定义事件。
    3.更好的运行时性能 (其模板会被编译成同一作用域内的渲染函数,避免了渲染上下文代理对象)。
    4.更好的 IDE 类型推导性能 (减少了语言服务器从代码中抽取类型的工作)。

在这里插入图片描述

b站视频讲解:剪辑中…

踩坑不易,还希望各位大佬支持一下 \textcolor{gray}{踩坑不易,还希望各位大佬支持一下} 踩坑不易,还希望各位大佬支持一下

📃 个人主页: \textcolor{green}{个人主页:} 个人主页: 沉默小管

📃 个人网站: \textcolor{green}{个人网站:} 个人网站: 沉默小管

📃 个人导航网站: \textcolor{green}{个人导航网站:} 个人导航网站: 沉默小管导航网

📃 我的开源项目: \textcolor{green}{我的开源项目:} 我的开源项目: vueCms.cn

🔥 技术交流 Q Q 群: 837051545 \textcolor{green}{技术交流QQ群:837051545} 技术交流QQ群:837051545

👍 点赞,你的认可是我创作的动力! \textcolor{green}{点赞,你的认可是我创作的动力!} 点赞,你的认可是我创作的动力!

⭐️ 收藏,你的青睐是我努力的方向! \textcolor{green}{收藏,你的青睐是我努力的方向!} 收藏,你的青睐是我努力的方向!

✏️ 评论,你的意见是我进步的财富! \textcolor{green}{评论,你的意见是我进步的财富!} 评论,你的意见是我进步的财富!

如果有不懂可以留言,我看到了应该会回复
如有错误,请多多指教

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/599508.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Chat2DB

序言 日常开发中,我们可能会用到MyBatis Generator自动生成Entity实体类、DAO接口以及对应的Mapper文件可以减少一部分的冗余代码开发量,随着AI的发展,可以将自然语言转换为SQL语句,例如ChatSQL、阿里的Chat2DB等。 Chat2DB简介…

缓存击穿以及解决方案

1.定义 缓存击穿问题也叫热点Key问题,就是一个被高并发访问并且缓存重建业务较复杂的key突然失效了,无数的请求访问会在瞬间给数据库带来巨大的冲击。 问题描述:假设线程1在查询缓存之后,本来应该去查询数据库,然后把…

linux离线安装redis

一、下载linux版本压缩包 地址:Download | Redis 为了安全稳定性,下载 6.2 版本,不下载最新版 二、上传到linux服务器 笔者上传到 /opt/redis下 ,使用Xftp和Xshell工具,使用root权限 cd /opt sudo mkdir redis cd r…

【小白学机器学习10】假设检验之1:F检验,F检验量的构造,F分布,F分布查表求P值等

目录 1 什么是F检验 F-test 1.1 F-test的定义 1.1.1 维基百科对F检验的定义 1.1.2 百度百科的定义 1.2 F检验的别名 1.3 F检验的判断手段 / 要达成的目标 / 适用范围 1.3.1 判断手段 1.3.2 对H0原假设的理解 1.3.3 判断目标/目的 1.3.4 适用的范围,场合 …

解决前端性能瓶颈:高效处理大量数据渲染与复杂交互的策略与优化方法

✨✨祝屏幕前的小伙伴们每天都有好运相伴左右,一定要天天开心!✨✨ 🎈🎈作者主页: 喔的嘛呀🎈🎈 目录 引言 一、分页加载数据 二、虚拟滚动 三、懒加载 四、数据缓存 五、减少重绘和回流 …

Android协程GlobalScope、lifecycleScope、CoroutineScope的launch,Kotlin

Android协程GlobalScope、lifecycleScope、CoroutineScope的launch,Kotlin import android.os.Bundle import android.util.Log import androidx.appcompat.app.AppCompatActivity import androidx.lifecycle.lifecycleScope import kotlinx.coroutines.CoroutineSc…

SpringMVC数据响应和请求

文章目录 1.SpringMVC简介2. SpringMVC快速入门3. SpringMVC执行的流程4.SpringMVC注解解释5. 视图解析器6.SpringMVC的数据响应6.1返回ModelView对象6.2直接返回字符串6.3返回json字符串 7.SpringMVC获得请求数据7.1 获得基本类型参数7.2获得POJO类型参数7.3获取数组类型参数7…

uniapp使用npm命令引入font-awesome图标库最新版本

uniapp使用npm命令引入font-awesome图标库最新版本 图标库网址:https://fontawesome.com/search?qtools&or 命令行: 引入 npm i fortawesome/fontawesome-free 查看版本 npm list fortawesome在main.js文件中: import fortawesome/fo…

163 Linux C++ 通讯架构实战17,本地套接字整理对比,IPC:pipe,fifo,mmap,信号,本地套

IPC: Linux环境下,进程地址空间相互独立,每个进程各自有不同的用户地址空间。任何一个进程的全局变量在另一个进程中都看不到,所以进程和进程之间不能相互访问,要交换数据必须通过内核,在内核中开辟一块缓冲…

git bash上传文件至github仓库

Linux运维工具-ywtool 目录 一.访问github二.新建仓库1.点击自己头像2.选择"your repositories"3.点击"New"4.创建新仓库 三.通过git bash软件上传文件1.提示2.打开git bash软件3.切换到本地仓库目录4.配置github的用户名和邮箱信息5.生成SSH Key6.github添…

【单源最短路 图论】882. 细分图中的可到达节点

作者推荐 视频算法专题 本文涉及知识点 单源最短路 图论 LeetCode 882. 细分图中的可到达节点 给你一个无向图(原始图),图中有 n 个节点,编号从 0 到 n - 1 。你决定将图中的每条边 细分 为一条节点链,每条边之间…

MySQL-5.函数

5.1 统计函数(聚合函数) # 统计数学成绩大于 90 的学生有多少个? SELECT COUNT(*) FROM student WHERE math > 90;# 求一个班级总分平均分 SELECT AVG(math english chinese) FROM student;# 统计一个班级数学总成绩 SELECT SUM(math) F…