最新 Vue3、TypeScript、组合式API、setup语法糖 学习笔记

最新 Vue3、TypeScript、组合式API、setup语法糖 学习笔记

  • 1、创建 Vue3 工程
    • 基于 `vue-cli` 创建(基于webpack实现)
    • 基于 `vite` 创建(推荐)
  • 2、Vue3 项目开发 `vscode` 插件推荐
  • 3、`Vue3` 核心语法
    • 【optionsAPI】与【CompositionAPI】
      • Options API 的弊端
      • Composition API 的优势
  • 4、【拉开序幕的 setup】
  • 5、`Vue3` 自定义组件命名插件推荐
  • 6、`ref` 创建:基本类型的响应式数据

1、创建 Vue3 工程

基于 vue-cli 创建(基于webpack实现)

备注:目前 vue-cli 已处于维护模式,官方推荐基于 Vite 创建项目。

// 查看 @vue/cli版本,确保@vue/cli版本在4.5.0以上
vue --version// 安装或者升级你的@vue/cli
npm install -g @vue/cli// 执行创建命令
vue create vue_demo

基于 vite 创建(推荐)

  • vite

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

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

相关文章

洛谷 P8630 [蓝桥杯 2015 国 B] 密文搜索

题目描述 福尔摩斯从 X 星收到一份资料,全部是小写字母组成。 他的助手提供了另一份资料:许多长度为 8 的密码列表。 福尔摩斯发现,这些密码是被打乱后隐藏在先前那份资料中的。 请你编写一个程序,从第一份资料中搜索可能隐藏…

K8S更新部署docker的两种方法举例

前提条件 imagePullPolicy: Always 方法1:删除更新法 test-project为命名空间 --删除所有asp-svc下面的pod,这会导致从新拉取镜像 kubectl delete pods -l appasp-svc -n test-project --删除指定的pod,这会导致从新拉取镜像 kubectl delete pod …

JSON协议详解、语法及应用

文章目录 一、什么是JSON二、JSON协议结构协议结构包括要素JSON语法规则JSON的协议结构示例 三、JSON的特点四、JSON常见应用场景 一、什么是JSON JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它以易于阅读和编写的文本格式…

MVC 、DDD(domain-driven design,软件主动学习业务)、中台、Java SPI(Service Provider Interface)

文章目录 引言I 单体架构DDD实现版本1.1 核心概念1.2 DDD四层架构规范1.3 案例1.4 请求转发流程II 领域服务调用2.1 菱形对称架构2.2 中台III Java SPI3.1 概念3.2 实现原理3.3 例子:本地SPI找服务see alsojava -cp<

Linux第60步_“buildroot”构建根文件系统第2步_配置“buildroot下的busybox”并测试“buildroot”生成的根文件系统

1、查看“buildroot下的busybox”安装路径 打开终端 输入“ls回车” 输入“cd linux回车/”&#xff0c;切换到到“linux”目录 输入“ls回车”&#xff0c;查看“linux”目录下的文件和文件夹 输入“cd buildroot/回车”&#xff0c;切换到到“buildroot”目录 输入“ls…

MySQL的 4 种连接查询

目录 一、内连接&#xff08;INNER JOIN) 二、外连接&#xff08;LEFT JOIN、RIGHT JOIN 和 FULL JOIN&#xff09; 三、交叉连接&#xff08;CROSS JOIN&#xff09; 四、自连接 在 MySQL 中&#xff0c;常见的连接查询有四种&#xff1a;内连接&#xff08;INNER JOIN&am…

MyBatisPlus 整合 SpringBoot 遇见的问题

【异常】&#xff1a;Cause: java.sql.SQLSyntaxErrorException: Unknown column ‘udf1’ in ‘field list’… SQL: SELECT id,oper_id,btch_id,udf1, FROM scan_cyber Cause: java.sql.SQLSyntaxErrorException: Unknown column ‘udf1’ in ‘field list’; ,"messag…

【Web】CTFSHOW java反序列化刷题记录(部分)

目录 web846 web847 web848 web849 web850 web856 web857 web858 web846 直接拿URLDNS链子打就行 import java.io.ByteArrayOutputStream; import java.io.IOException; import java.io.ObjectOutput; import java.io.ObjectOutputStream; import java.lang.reflect.F…

Eclipse - Switch Workspace

Eclipse - Switch Workspace References Switch Workspace References [1] Yongqiang Cheng, https://yongqiang.blog.csdn.net/

用GPT-4开启“人类宝藏”

“GPT-4开启人类宝藏”意味着下面几个层面的含义&#xff1a; 知识与信息的访问&#xff1a;GPT-4作为一款强大的语言模型&#xff0c;通过学习海量的数据和信息资源&#xff0c;可以近乎实时地提供人类历史积累的知识、经验与智慧。用户可以通过询问或交互方式获取这些信息&am…

数据库所在服务器磁盘满了怎么办?

大家好&#xff0c;我是G探险者。 给大家拜个晚年哈&#xff0c;节后上班第一天&#xff0c;打开电脑&#xff0c;发现数据库服务器连不上了。 幸亏&#xff0c;节后第一天上班的人不太多&#xff0c;领导还没来&#xff0c;我一番鼓捣解决了这个问题。 所以做个总结&#xff0…

Linux网络----防火墙

一、安全技术和防火墙 1、安全技术 入侵检测系统&#xff08;Intrusion Detection Systems&#xff09;&#xff1a;特点是不阻断任何网络访问&#xff0c;量化、定位来自内外网络的威胁情况&#xff0c;主要以提供报警和事后监督为主&#xff0c;提供有针对性的指导措施和安…

【c++基础】合影效果

说明 小明和朋友们去爬香山&#xff0c;为美丽的景色所陶醉&#xff0c;想合影留念。如果他们站成一排&#xff0c;男生全部在左&#xff08;从拍照者的角度&#xff09;&#xff0c;并按照从矮到高的顺序从左到右排&#xff0c;女生全部在右&#xff0c;并按照从高到矮的顺序…

unity学习(19)——客户端与服务器合力完成注册功能(1)入门准备

逆向服务器用了三天的时间&#xff0c;但此时觉得一切都值&#xff0c;又可以继续学习了。 服务器中登录请求和注册请求由command变量进行区分&#xff0c;上一层的type变量都是login。 public void process(Session session, SocketModel model) {switch (model.Command){ca…

Cannot resolve symbol ‘IWXAPI‘

问题 Android 集成 微信登录报错 Cannot resolve symbol IWXAPI详细问题 笔者在App的build.gradle中已添加相关依赖&#xff0c;并完成Sync gradle操作。 笔者Project的build.gradle核心代码 buildscript {repositories {jcenter() // 原有 jCenter 引用可继续保留…

通过MetricsAPI监控pod资源使用情况(k8s资源监控,java)

1. 目的&#xff1a;简单监控pod 我想使用java监控k8s pod的资源的简单使用情况&#xff0c;但是k8s内部并没有采集资源的实现。 但是k8s提供了一套k8s的对接标准&#xff0c;只要适配这套标准&#xff0c;就可以通过kubelet采集资源数据&#xff0c;并且通过k8s api服务器输出…

Java集合篇之深度解析Queue,单端队列、双端队列、优先级队列、阻塞队列

写在开头 队列是Java中的一个集合接口&#xff0c;之前的文章已经讲解了List和Set&#xff0c;那么今天就来唠一唠它吧。队列的特点&#xff1a;存储的元素是有序的、可重复的。 队列的两大接口Queue vs Deque Queue 是单端队列&#xff0c;只能从一端插入元素&#xff0c;另…

Linux shell 命令中nohup 、、重定向的使用

一、nohup 和 & 使用方法 1.1、 nohup &#xff08;不挂断&#xff09; nohup 是 no hung up 的缩写&#xff0c;意思是不挂断 。 使用 Xshell 等Linux 客户端工具&#xff0c;远程执行 Linux 脚本时&#xff0c;有时候会由于网络问题&#xff0c;导致客户端失去连接&…

使用CompletableFuture在主线程捕获子线程异常

场景&#xff1a;我们使用线程池的时候&#xff0c;假如说某个线程出现了异常此时我们需要将异常捕获打印出相应的异常日志 这个时候就可以用到CompletableFuture的exceptionally方法&#xff0c;其作用是返回一个新的CompletableFuture&#xff0c;如果原CompletableFuture以…

电路设计(20)——数字电子钟的multism仿真

1.设计要求 使用数字芯片&#xff0c;设计一个电子钟&#xff0c;用数码管显示&#xff0c;可以显示星期&#xff0c;时、分、秒&#xff0c;可以有按键校准时间。有整点报警功能。 2.设计电路 设计好的multism电路图如下所示 3.芯片介绍 时基脉冲使用555芯片产生。在仿真里面…