当前位置: 首页 > news >正文

vue 简单实验 自定义组件 component

1.代码

<script src="https://unpkg.com/vue@next" rel="external nofollow" ></script>
<div id="components-demo"><button-counter></button-counter>
</div>
<script>
// 创建一个Vue 应用
const app = Vue.createApp({})
// 定义一个名为 button-counter 的新全局组件
app.component('button-counter', {data() {return {count: 0}},template: `<button @click="count++">You clicked me {{ count }} times.</button>`
})
// 绑定一个新的组件,新的组件中使用前面创建的组件
app.mount('#components-demo')
</script>

2.运行

 

http://www.lryc.cn/news/145123.html

相关文章:

  • C++ 改善程序的具体做法 学习笔记
  • Unity 之 GameObject.Find()在场景中查找指定名称的游戏对象
  • flink on yarn with kerberos 边缘提交
  • NodeJS的简介以及下载和安装
  • 量化面试-概率题
  • 【spark】java类在spark中的传递,scala object在spark中的传递
  • php 文字生成图片保存到本地
  • 面试手撕—二叉搜索树及其后序遍历
  • Java数据结构面试题以及答案
  • Java——它要求用户输入一个整数(实际上是一个字符串),然后计算该整数的平方值,并将结果输出。
  • 【科研论文配图绘制】task6直方图绘制
  • Leetcode刷题:395. 至少有 K 个重复字符的最长子串、823. 带因子的二叉树
  • java八股文面试[多线程]——Synchronized的底层实现原理
  • C#,《小白学程序》第三课:类、类数组与排序
  • 史上最全AP、mAP详解与代码实现
  • 百数应用中心——生产制造管理解决方案解决行业难题
  • 《存储IO路径》专题:IO虚拟化初探
  • Springboot2.0快速入门(第一章)
  • Flink流批一体计算(17):PyFlink DataStream API之StreamExecutionEnvironment
  • javeee spring cglib动态代理
  • 【Docker】Dockerfile介绍
  • 两个hdfs之间迁移传输数据
  • C++ 缺失的数字
  • JVM,JRE和JDK的区别
  • 合宙Air724UG LuatOS-Air LVGL API控件--日历 (Calendar)
  • [python]问题:pandas处理excel里的多个sheet
  • [MySQL] MySQL基础操作汇总
  • C语言每日一题 ---- 打印从1到最大的n位数(Day 1)
  • 2023-08-23 LeetCode每日一题(统计点对的数目)
  • LLMs之Code:SQLCoder的简介、安装、使用方法之详细攻略