首页 > 其他分享 >vue详细教程

vue详细教程

时间:2022-11-24 10:22:33浏览次数:83  
标签:教程 vue createApp Counter Vue num 详细 id

原文链接:https://www.cnblogs.com/MrFlySand/p/16921017.html

02vue的安装

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="vue3.js"></script>
</head>
<!-- vue语法,告诉vue,这里放了一个变量,2个{}表示变量 -->
<div id="counter">
    <p>{{id}}</p>
    <p>{{name}}</p>
</div>

<div class="counter">
    <p>QQ</p>
    <P>{{num}}</P>
</div>

<body>
    <script>
        const Counter = { //配置方法
            data: function() {
                return {
                    id: "公众号",
                    name: "小知识酷",
                    num: 2602629626,
                }
            }
        }
        Vue.createApp(Counter).mount("#counter"); //创建应用,将配置对象传入
        Vue.createApp(Counter).mount(".counter");
    </script>
</body>

</html>

标签:教程,vue,createApp,Counter,Vue,num,详细,id
From: https://www.cnblogs.com/MrFlySand/p/16921017.html

相关文章

  • 拼多多详情API详细使用教程
    API是应用程序的开发接口,在开发程序的时候,我们有些功能可能不需要从到到位去研发,我们可以拿现有的开发出来的功能模块来使用,而这个功能模块,就叫做库(libary)。比如说:要实现......
  • 【iOS-Cocos2d游戏开发之二】Cocos2D 游戏开发资源贴(教程以及源码)
    ​​ 李华明Himi ​​​原创   这两天抽出一些时间学习cocos2d,发现资料N多,而且讲解的相当的全面;那么这段时间我也处于不断的学习中,当然好东西不私藏,这里我把比较经典......
  • 记笔记 vue创建项目
    困难的工作才有价值。你的问题不解决吗?要解决问题。自强不息。困难就是进步,还有进步空间。因为我学这个遇见了很多帮助我的人,所以我必须学这个,前面的努力才没白费。项目......
  • Vba菜鸟教程
    Vba菜鸟教程_WY_记录的博客-CSDN博客_vba教程......
  • VUE3 自定义 轻量级全局数据共享方案之一 Provide&inject (简单快速实现vuex功能)
    在vue2中,提供了provide和inject配置,可以让开发者在高层组件中注入数据,然后在后代组件中使用除了兼容vue2的配置式注入,vue3在compositionapi中添加了provide和inject方法......
  • 我的Vue之旅 11 Vuex 实现购物车
    VueCartView.vuescript数组的filter函数需要return显式返回布尔值,该方法得到一个新数组。使用Vuexstore的modules方式,注意读取状态的方式this.$store.state.cart.i......
  • DataX入门教程1
    DataX入门教程概述什么是DataX​ DataX是阿里巴巴开源的一个异构数据源离线同步工具,致力于实现包括关系型数据库(MySQL、Oracle等)、HDFS、Hive、ODPS、HBase、FTP等各种......
  • DataX入门教程2
    DataX入门教程2接DataX入门教程1MongoDB什么是MongoDBMongoDB是由C++语言编写的,是一个基于分布式文件存储的开源数据库系统。MongoDB旨在为WEB应用提供可扩展的高性......
  • windows--cmake与c++的使用教程(14)
    1概述本文基于前文环境本节目标:target_include_directories用法2作用target_include_directories的作用,用于给固定目标指定头文件搜索路径。moderncmake之......
  • Vulnhub之Hacksudo LPE靶机详细解题过程
    HacksudoLPE作者:Jason_huawen靶机基本信息名称:hacksudo:L.P.E.地址:hacksudo:L.P.E.~VulnHub识别目标主机IP地址─(kali㉿kali)-[~/Vulnhub/Hacksudo_LPE]└─......