Vue3【三】 使用TS自己编写APP组件

Vue3【三】 使用TS自己编写APP组件

运行截图

在这里插入图片描述

目录结构

注意目录层级

在这里插入图片描述

文件源码

APP.vue
<template><div class="app"><h1>你好世界!</h1></div>
</template><script lang="ts">
export default {name:'App' //组件名字
}</script><style>.app {background-color: #4fffbb;box-shadow: 0 0 10px;border-radius: 10px;padding: 20px;}
</style>
main.ts
// 引入createApp用于创建应用
import {createApp} from 'vue'
// 引入APP根组件
import App from './App.vue'createApp(App).mount('#app')
index.html
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><link rel="icon" href="/favicon.ico"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Vite App</title></head><body><div id="app"></div><script type="module" src="/src/main.ts"></script></body>
</html>

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

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

相关文章

【乐吾乐3D可视化组态编辑器】数据接入

【乐吾乐3D可视化组态编辑器】数据接入

数据接入 本文为您介绍3D数据接入功能&#xff0c;数据接入功能分为三个步骤&#xff1a;数据订阅、数据集管理、数据绑定 编辑器地址&#xff1a;3D可视化组态 - 乐吾乐Le5le 数据订阅 乐吾乐3D组态数据管理功能由次顶部工具栏中按钮数据管理打开。 在新弹窗中选择数据订阅…
阅读更多...
vue2 后端传年月日 时分秒 前端拿到当日时间 做对比 如果是当日的时间 筛选出来

vue2 后端传年月日 时分秒 前端拿到当日时间 做对比 如果是当日的时间 筛选出来

getList () { this.loading true listAlarm(this.queryParams).then(response > { this.listData response.rows const currentDate new Date() const year currentDate.getFullYear() const month currentDate.getMonth() 1 // 月份是从 0 开始计数的&#xff0c;所以…
阅读更多...
图像的IO操作

图像的IO操作

代码&#xff1a; import cv2 as cvimport matplotlib.pyplot as plt​#读取图像img cv.imread("../data/images/zidane.jpg")​#显示图像#2.1 OpenCVcv.imshow("dili",img)cv.waitKey(0)cv.destroyAllWindows()​#2.2 matplotlibplt.imshow(img[:,:,::-…
阅读更多...
[matlab]折线图之多条折线如何绘制实心圆作为标记点

[matlab]折线图之多条折线如何绘制实心圆作为标记点

使用MarkerFaceColor是标记点填充的颜色&#xff0c;b&#xff0c;表示blue&#xff0c;蓝色 plot(x, a, d--, MarkerFaceColor, b); % 绘制仿真结果的曲线如果一张图多条曲线那么每条曲线需要单独调用一次plot&#xff0c;每个plot间用hold on 连接 plot(x, a, d--, MarkerF…
阅读更多...
Oracle和mysql中插入时间字段

Oracle和mysql中插入时间字段

例如有id 和 times两个字段 Oracle insert into xxx values|(1,sysdate) mysql insert into xxx values(1,now()) 在 MySQL 中&#xff0c;SYSDATE() 函数也是可用的&#xff0c;它与 NOW() 类似&#xff0c;但略有不同&#xff1a; NOW…
阅读更多...
Linux网络配置命令

Linux网络配置命令

文章目录 Linux网络配置的重要命令ifconfig命令网卡配置信息 hostname命令route命令创建一个路由创建默认路由删除路由&#xff1a; netstat命令ss命令lsof命令telnet命令ping命令traceroute命令nslookup命令两个重要相关文件 Linux网络配置的重要命令 ifconfig命令 ifconfig…
阅读更多...
基于springboot实现社区养老服务系统项目【项目源码+论文说明】计算机毕业设计

基于springboot实现社区养老服务系统项目【项目源码+论文说明】计算机毕业设计

基于springboot实现社区养老服务系统演示 摘要 现代经济快节奏发展以及不断完善升级的信息化技术&#xff0c;让传统数据信息的管理升级为软件存储&#xff0c;归纳&#xff0c;集中处理数据信息的管理方式。本社区养老服务系统就是在这样的大环境下诞生&#xff0c;其可以帮助…
阅读更多...
从0开始学统计-什么是回归？

从0开始学统计-什么是回归？

1.什么是回归&#xff1f; 回归&#xff08;Regression&#xff09;是统计学中一种用于探索变量之间关系的分析方法。它主要用于预测一个或多个自变量&#xff08;输入变量&#xff09;与因变量&#xff08;输出变量&#xff09;之间的关系。在回归分析中&#xff0c;我们尝试根…
阅读更多...
PHP质量工具系列之php-depend

PHP质量工具系列之php-depend

php-depend是一个开源的静态代码分析工具&#xff0c;它的主要功能包括&#xff1a; 代码质量分析 复杂度度量&#xff1a;计算类、方法和函数的Cyclomatic Complexity&#xff08;循环复杂度&#xff09;&#xff0c;帮助识别潜在的复杂代码段。 耦合度度量&#xff1a;分析类…
阅读更多...
瑞鑫RK3588 画中画 OSD 效果展示

瑞鑫RK3588 画中画 OSD 效果展示

这些功能本来在1126平台都实现过 但是迁移到3588平台之后 发现 API接口变化较大 主要开始的时候会比较费时间 需要找到变动接口对应的新接口 之后 就比较好操作了 经过几天的操作 已实现 效果如下
阅读更多...
刷代码随想录有感（95）：合并区间

刷代码随想录有感（95）：合并区间

题干&#xff1a; 代码&#xff1a; class Solution { public:static bool cmp(vector<int>& a, vector<int>& b){return a[0] < b[0];}vector<vector<int>> merge(vector<vector<int>>& intervals) {sort(intervals.begi…
阅读更多...
MySQL排序操作

MySQL排序操作

025排序操作 select .. from .. order by 字段 asc/descselect empno, ename, sal from emp order by sal asc;asc 不写的话&#xff0c;默认升序 多个字段排序 查询员工的编号、姓名、薪资&#xff0c;按照薪资升序排列&#xff0c;如果薪资相同的&#xff0c;再按照姓名升…
阅读更多...
New Work-flow of Circuit Bootstrapping

New Work-flow of Circuit Bootstrapping

参考文献&#xff1a; [CGGI17] Chillotti I, Gama N, Georgieva M, et al. Faster packed homomorphic operations and efficient circuit bootstrapping for TFHE. ASIACRYPT 2017 (1): 377-408.[CDKS21] Chen H, Dai W, Kim M, et al. Efficient homomorphic conversion be…
阅读更多...
爬取基金收盘价并用pyecharts进行展现

爬取基金收盘价并用pyecharts进行展现

爬取基金收盘价并用pyecharts进行展现 一、用到的第三方包 因为使用到了一些第三方的包&#xff0c;包还是比较大的如果直接从社区下载比较费劲&#xff0c;所以建议配置国内镜像源&#xff0c;这里以清华的镜像源为例。 pip config set global.index-url https://pypi.tuna…
阅读更多...
uni微信小程序editor富文本组件如何插入图片

uni微信小程序editor富文本组件如何插入图片

需求 在editor中插入图片&#xff0c;并对图片进行编辑&#xff0c;简略看一下组件的属性&#xff0c;官网editor 组件 | uni-app官网 解决方案 首先要使用到ready这个属性&#xff0c;然后官网有给代码粘过来&#xff0c;简单解释一下这段代码的意思&#xff08;作用是在不同…
阅读更多...
坐实了！“神坛企业”也是草台班子

坐实了！“神坛企业”也是草台班子

越接近真相&#xff0c;越觉得荒诞&#xff01;这次就算删稿也得说两句&#xff0c;KP基于BMC的“可信计算”&#xff0c;正在沦为业内笑柄。戳破那层保护色&#xff0c;施施然端坐神坛的某厂&#xff0c;内里可能也是个草台班子。 近期&#xff0c;网上流传着几页HW给客户洗脑…
阅读更多...
k8s-pod参数详解

k8s-pod参数详解

目录 概述创建Pod编写一个简单的Pod添加常用参数为Pod的容器分配资源网络相关Pod健康检查启动探针存活探针就绪探针 作用整个Pod参数配置创建docker-registry 卷挂载 结束 概述 k8s中的pod参数详解。官方文档   版本 k8s 1.27.x 、busybox:stable-musl、nginx:stable-alpine3…
阅读更多...
EXCEL多sheet添加目录跳转

EXCEL多sheet添加目录跳转

EXCEL多sheet添加目录跳转 背景 excel中有几十个sheet&#xff0c;点下方左右切换sheet太耗时&#xff0c;希望可以有根据sheet名超链接跳转相应sheet&#xff0c;处理完后再跳回原sheet。 方案一 新建目录sheet&#xff0c;在A1写sheet名&#xff0c;右键选择最下方超链接…
阅读更多...
【免费】2021年数学建模国赛C题问题一--基于熵权法和TOPSIS法详细版附Word加代码

【免费】2021年数学建模国赛C题问题一--基于熵权法和TOPSIS法详细版附Word加代码

各位大佬好 &#xff0c;这里是阿川的博客&#xff0c;祝您变得更强 个人主页&#xff1a;在线OJ的阿川 大佬的支持和鼓励&#xff0c;将是我成长路上最大的动力 阿川水平有限&#xff0c;如有错误&#xff0c;欢迎大佬指正 Python 初阶 Python–语言基础与由来介绍 Python–…
阅读更多...
Linux进程间通信之管道

Linux进程间通信之管道

进程间通信介绍&#xff1a; 进程间通信的概念&#xff1a; 进程间通信简称IPC&#xff08;Interprocess communication&#xff09;&#xff0c;进程间通信就是在不同进程之间传播或交换信息。 进程间通信的目的&#xff1a; 数据传输&#xff1a; 一个进程需要将它的数据…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023