vue.js用cdn引入_vue-danmaku cnd引入-程序员宅基地

技术标签： 前端   

<!DOCTYPE html>
<html lang="en">
<head>
  <title></title>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<style type="text/css">
.transition-box {
      
    margin-bottom: 10px;
    width: 200px;
    height: 100px;
    border-radius: 4px;
    background-color: #409EFF;
    text-align: center;
    color: #fff;
    padding: 40px 20px;
    box-sizing: border-box;
    margin-right: 20px;
  }

</style>
</head>
<body>
    
<div id="app">
<template>
  <div>
    <el-button @click="show = !show">Click Me</el-button>

    <div style="display: flex; margin-top: 20px; height: 100px;">
      <transition name="el-fade-in-linear">
        <div v-show="show" class="transition-box">.el-fade-in-linear</div>
      </transition>
      <transition name="el-fade-in">
        <div v-show="show" class="transition-box">.el-fade-in</div>
      </transition>
    </div>
  </div>
</template>
</div>
  </body>
</html>
 
<script type="text/javascript">
  var Main = {
      
    data: () => ({
      
      show: true
    })
  }
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
</script>

运行效果:
请添加图片描述
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chendongpu/article/details/119801282

智能推荐

tomcat版本_appears to have started a thread named [activemq i-程序员宅基地

文章浏览阅读3k次。tomcat版本使用6.0.33的时候会出现很多问题，此版本引入了内存管理机制，很多jar包不符合标准。会出现如下等信息十一月 18, 2011 2:17:12 下午 org.apache.catalina.loader.WebappClassLoader clearReferencesJdbc严重: The web application registered the JDBC driv_appears to have started a thread named [activemq inactivitymonitor worker] b

HCIA静态路由实验报告_路由实训目的-程序员宅基地

文章浏览阅读844次。HCIA静态路由实验报告实验日期： 2020年11月4日课程名称： HCIA实验名称： 静态路由HCIA一、实验目的熟练掌握华为静态路由配置命令二、实验内容三、概要设计1、划分地址，配置IP2、静态路由配置3、单臂路由配置4、NAT四、详细设计1、划分地址，配置IP2、静态路由1）静态路由2）路径备份（浮动静态路由）3）空接口防环3、单臂路由SW2同理..._路由实训目的

DataFrame求某列数据的均值，方差等统计数_dataframe计算某列平均值-程序员宅基地

文章浏览阅读1.1w次，点赞13次，收藏75次。DataFrame求某列数据的均值，方差等统计数_dataframe计算某列平均值

POI 3.14 读excel hssf && xssf-程序员宅基地

文章浏览阅读297次。first: poi 3.14 要求jdk1.6 或以上 jar包去apache下载就可以了. 另外,要完整运行需要xmlbeans 的jar包, 我下的是 xmlbeans-2.6.0.jar 附件里有 项目所用jar包,测试用的excel,及该项目项目总共需要3个jar包,除jdk外: 1 poi-3.14-xxxx.jar ..._poi.ooxml版本3.14读取excel

思维导图的绘制要点及使用GitMind工具快速制作思维导图_gitmind思维导图怎么左右都有-程序员宅基地

文章浏览阅读3.7k次。文章目录前言一、什么是思维导图？二、思维导图的绘制要点三、使用GitMind工具快速制作思维导图总结前言在解决复杂问题时，有一个非常实用的工具就是思维导图，它简单易上手。其实在大二时老师有讲过思维导图的绘制，但是自己一直懒得用，一是习惯了记文字笔记，二是平常编码用的是电脑，惧怕在线工具的学习成本。但是笔者最近在找开源项目，设计项目模块时，用传统笔记方式已经不太能胜任了，痛定思痛之下，决定学一下思维导图的绘制要点以及使用在线软件绘制，经过学习发现简单到超乎想象。这里笔者推荐使用一款叫GitMin._gitmind思维导图怎么左右都有

Python中单引号，双引号,3个引号的用法_在python中,单个字符必须用单引号括起来表示,多个字符用双引号括起来表示-程序员宅基地

文章浏览阅读1.5w次，点赞10次，收藏4次。Python中单引号，双引号，3个单引号及3个双引号的区别一、单引号和双引号在Python中我们都知道单引号和双引号都可以用来表示一个字符串，比如str1='python&#..._在python中,单个字符必须用单引号括起来表示,多个字符用双引号括起来表示

随便推点

python 画子图+双坐标轴图_python 双坐标轴-程序员宅基地

文章浏览阅读1.5k次。python 画子图+双坐标轴图_python 双坐标轴

解决包含 GitHub Actions Workflow 的分支无法推送的问题_refusing to allow an oauth app to create or update-程序员宅基地

文章浏览阅读1.5k次。问题试图向 GitHub 推送一个分支的时候，出现错误 refusing to allow an OAuth App to create or update workflow {0} without workflow scope。这个错误是说，因为 OAuth 的应用没有指定 workflow 范围，所以无法推送带有更新 workflow 的分支。虽然我实际上没有对 workflow 做任何更新，但也被拒绝了。所以这个问题必须直接解决，绕不开。git.exe push self master:t/w_refusing to allow an oauth app to create or update workflow `.github/workflo

MySQL：向已有数据表中插入新的一列数据_mysql新增一列如何插入数据-程序员宅基地

文章浏览阅读6.9w次，点赞47次，收藏143次。一、需求有两个表格，test和test2如下所示：mysql&gt; select * from test;+------+------+------------+| data | id | timestamp |+------+------+------------+| 300 | 3 | 1536292800 || 200 | 2 | 1536292..._mysql新增一列如何插入数据

【100个 Unity小知识点】 | Unity中常用的几种单例写法_unity 单例写法-程序员宅基地

文章浏览阅读5.3w次，点赞32次，收藏51次。Unity 小科普老规矩，先介绍一下 Unity 的科普小知识：Unity是 实时3D互动内容创作和运营平台 。包括游戏开发、美术、建筑、汽车设计、影视在内的所有创作者，借助 Unity 将创意变成现实。Unity 平台提供一整套完善的软件解决方案，可用于创作、运营和变现任何实时互动的2D和3D内容，支持平台包括手机、平板电脑、PC、游戏主机、增强现实和虚拟现实设备。 也可以简单把 Unity 理解为一个游戏引擎，可以用来专业制作游戏！ Unity 小知识点学习Unity中常用的几种单._unity 单例写法

python catch_GitHub - wucao/JCatch: Exception异常管理平台，支持Java、PHP、Python等多种语言...-程序员宅基地

文章浏览阅读127次。什么是JCatch当程序发生异常(Exception)，处理方式一般是通过日志文件记录下来，这种方式很容易被忽略，而且查询起来比较麻烦。JCatch提供了一种方案，当程序发生异常时，通过JCatch平台接口提交到JCatch平台，由JCatch平台统一管理所有异常，这样可以方便查询，并且JCatch平台提供异常监控功能，当应用程序发生异常时会以邮件方式提醒相关人员。应用列表:应用配置:异常列表:J..._python jcatch

Vue3 中引入wangeditor富文本编辑器-程序员宅基地

文章浏览阅读8.1k次，点赞4次，收藏30次。引入一个可以在网页中直接创作的编辑器.

推荐文章

热门文章

相关标签