vue3实现打字机的效果

前言:

        vue3项目中实现打字机的效果。

实现效果:

实现步骤:

1、安装插件

npm i vue3typed

2、main.js中配置

import vuetyped from 'vue3typed'const app = createApp(App)
// 挂载打字机的全局方法
app.use(vuetyped)

3、界面使用

 <vuetyped :showCursor="false" :smart-backspace="false" :strings="writeTextArr" :type-speed="15"><div class="typing" />
</vuetyped>
<script setup>const writeTextArr = ref(["张庚生于1911年,生长在中国旧戏改良、新剧登场这个充满博弈的文化环境中,其思想中既有中国传统戏曲影响下的中国美学理想,又有中国人睁眼看世界的民族视野,并贯穿其研究事业的始终。",]);
</script>

4、api文档

。。。

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

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

相关文章

易中天与单田芳的区别在哪儿

单田芳先生是中国著名的评书演员&#xff0c;我非常喜欢听单田芒的评书&#xff0c;在那个没有电视机的时代&#xff0c;收听单田芳先生的评书对我来说就是一种最大的人生享受。所以&#xff0c;“单田芳”这三个字早就镌刻在我的脑海之中。一直到今天我还深深地敬仰着这位全国…

Express + Node 爬取网站数据

前言 因为自己写的demo需要历史天气的统计数据&#xff0c;但是国内很难找到免费的api接口&#xff0c;很多都需要付费和审核。而国外的网站虽然免费但需要提前知道观测站&#xff0c;城市id等信息。所以就有了这么一篇文章的诞生。 准备工作 库 作用superagent发送请求supera…

ajax省级联动 回发或回调参数无效

今天在做项目有个修改内容的&#xff0c;有个地方用到省级联动&#xff0c;现在一般都用ajax&#xff0c;很少用auto什么的那个属性了 想想ajax做省级联动也很简单&#xff0c;就开始做了&#xff0c;没想到在修改的时候提示回发或回调参数无效&#xff0c;然后去网上找了好久 …

虚拟局域网(VLAN)的管理

什么是虚拟局域网&#xff1f;虚拟局域网是一种用逻辑的定义方法&#xff0c;把两个或更多的连在交换网络上的终端规划在一起。 这种逻辑定义方法可以延伸到多个交换机。被规划在一起的终端&#xff0c;可以通过几种网络设置来规划。好像任何一种网络技术一样&#xff0c;了解…

学习antd-design-pro

学习使用react-antd-pro框架(一篇学习中的问题思考记录) 框架介绍 react-antd-pro 大体上等于 react antd pro。官网对于相关技术栈的描述如下&#xff1a; 我们的技术栈基于 ES2015、React、UmiJS、dva、g2 和 antd UmiJS: 可插拔的企业级 react 应用框架 dva: React and r…

SqlZoo.net习题答案:The Join 【Movie】

习题地址&#xff1a;http://sqlzoo.net/3.htm 表结构&#xff1a;  movie(id, title, yr, director)      actor(id, name)      casting(movieid, actorid, ord) 1b.Give year of Citizen Kane. select yr from movie where title Citizen Kane 1c.List all …

汉语编程++

没想到汉语编程又有人开始网上对骂了。一方指另一方骗人&#xff0c;一方吹自已伟大。今天群里头有人又把它翻出来了&#xff0c;刚好无聊&#xff0c;也就发明了一个汉语编程语言&#xff0c;集成到visual studio 2005的IDE中&#xff0c;名字就叫汉语编程&#xff0c;欢迎同样…

hightopo学习系列:hightopo介绍(一)

起因 新的软件主管来公司以后&#xff0c;有整整2周的时间没有搭理前端开发。就在这周一快下班的时候&#xff0c;突然和我说话了。问了我一些以前用的图形库&#xff0c;并让我开始了解hightopo。甩给了我一个全拼&#xff0c;就拂袖而去&#xff0c;留下一脸懵逼的我。 没办…

mongo指令

use admin db.runCommand({logRotate:1}) show dbs; db.currentOp(); db.serverStatus().connections db.killOp(26593769); use adbname db.tblname.ensureIndex({"sendtime":1}) db.tblname.getIndex() 转载于:https://www.cnblogs.com/ccgblog/p/8427972.html

女人,向《奋斗》中的夏琳米莱们学习什么

被称为赵宝刚导演的转型之作电视连续剧《奋斗》&#xff0c;看得我有些意犹未尽。据说佟大为与马伊俐都是本色表演&#xff0c;但是我却更喜欢剧中米莱的角色。 刚开始看《奋斗》的时候&#xff0c;以为夏琳是许晴演的呢&#xff0c;从长相性格表情连发型都像&#xff0c;像缩小…

vue项目积累

工作记录 1.修饰符及其使用 最近项目上看到这样的代码&#xff1a; child组件隐藏模态框触发以下事件 closeHandler () {this.$emit(update:open, false)},查阅资料发现&#xff0c;这是以修饰符的方式实现了“双向绑定”&#xff0c;避免了真正的双向绑定会带来维护上的问题。…

OpenCV4Android Tutorial0解析

Tutorial0是一个纯粹的android程序&#xff0c;没有opencv部分&#xff0c;是其他程序的框架基础。 有Sample0Base.java, Sample0View.java&#xff0c; SampleViewBase.java.三个文件。 Sample0Base 是程序入口&#xff0c;主要设置surfaceview和菜单。 requestWindowFeature(…

NPM管理

npm 发布流程 npm loginnpm versionnpm publish npm version npm version <update_type> // types: patch, major, or minor主版本号&#xff08;Major&#xff09;.次版本号&#xff08;Minor&#xff09;.修订号&#xff08;Patch&#xff09; 版本号递增规则: 主版…

网络工程师应掌握的50个路由器知识要点

1、什么时候使用多路由协议?  当两种不同的路由协议要交换路由信息时&#xff0c;就要用到多路由协议。当然&#xff0c;路由再分配也可以交换路由信息。下列情况不必使用多路由协议:  从老版本的内部网关协议( Interior Gateway Protocol&#xff0c;I G P)升级到新版本的…

Unity工程无代码化

目的 Unity默认是将代码放入工程&#xff0c;这样容易带来一些问题。1. 代码和资源混合&#xff0c;职能之间容易互相误改。2. 当代码量膨胀到一定程度后&#xff0c;代码的编译时间长到无法忍受。新版的unity支持通过asmdef来将代码分成多个dll工程&#xff0c;有所缓解。所以…

曾国藩传 读后感

转载于:https://www.cnblogs.com/eat-too-much/p/11335113.html

hdu 1102 pku 2421 解题报告

这题很简单&#xff0c;我差不多15分钟就写好代码了&#xff0c;运行结果也是正确的。可提交就是RE&#xff0c;百思不得其解&#xff0c;调了两个小时的时候&#xff0c;我才忽然发现我存边的时候数组开小了&#xff0c;我当时也想到肯定是数组问题&#xff0c;但是我却忽律了…

深入C#学习系列一:序列化(Serialize)、反序列化(Deserialize)

深入C#学习系列一&#xff1a;序列化(Serialize)、反序列化(Deserialize) 序列化又称串行化&#xff0c;是.NET运行时环境用来支持用户定义类型的流化的机制。其目的是以某种存储形成使自定义对象持久化&#xff0c;或者将这种对象从一个地方传输到另一个地方。.NET框架提供了两…

分别用 数组和链表处理约瑟夫环问题

#include <stdio.h> #include <stdlib.h> int main() { int k0,n0,s0,m0; //k为1,2,3报数时的计数变量,m为退出人数 int num [100]; int *pnum; int i; printf("Enter the number of person and the key:"); scanf("%d%d",&n,…

QT_环境搭建

QT_环境搭建 Qt软件安装&#xff1a;https://www.jianshu.com/p/65bc892829a0 Qt软件下载&#xff1a;https://mirrors.tuna.tsinghua.edu.cn/qt/official_releases/qt/5.13/5.13.0/ 转载于:https://www.cnblogs.com/panda-w/p/11338742.html