VUE学习

  • import { ref } from 'vue'; 引入了 Vue 的 ref 函数,用于创建响应式数据。
  • const message = ref('Hello Vue3'); 创建了一个响应式变量 message 并初始化为字符串 'Hello Vue3'。
  • <h1>{``{ message }}</h1> 使用了 Vue 的插值表达式 {``{ message }} 来显示 message 变量的值。
  • 样式部分目前为空,您可以在这里添加 CSS 来美化组件。
  1. data 函数 :返回一个对象,其中包含一个名为 count 的属性,初始值为 0。这个属性是响应式的,当它变化时,视图也会相应更新。

  2. methods 对象 :包含一个名为 increment 的方法,当调用这个方法时,count 的值会增加 1。

  3. mounted 钩子:在组件被挂载到 DOM 后执行,这里它在控制台输出了一条消息 'Vue mounted...'。

  4. 模板部分 :包含一个按钮,当点击这个按钮时,会触发 increment 方法。按钮上显示的文本是 count: {``{ count }},其中 {``{ count }} 是一个插值表达式,用于显示 count 的当前值。

相关推荐
hunterandroid6 分钟前
HarmonyOS HUKS 密钥全生命周期实战:生成、轮换与失效处理
前端·华为
damoluomu8 分钟前
SSG 的后台怎么补:Node.js 生态里的三条路(番外二)
javascript·css·typescript·node.js·html
li星野13 分钟前
【学习记录】DAP调试器电路原理图完全详解:从STM32最小系统到SWD调试接口
stm32·嵌入式硬件·学习
东鹏特饮15 分钟前
贪吃蛇小游戏html
前端·javascript·html
溪语流沙17 分钟前
【每天一个CSS | Day23】边框上有一道光在跑的流光呼吸卡片
前端·css
小马不起床19 分钟前
零基础玩转 FastAPI_10:前端登录、权限与布局
前端·状态模式·fastapi
诸神缄默不语22 分钟前
小春学习日刊 2026年第2期:2026.10.14
学习
程序员Sunday26 分钟前
JavaScript 深拷贝和浅拷贝有什么区别?structuredClone 能替代 JSON 拷贝吗?
前端·javascript
qq_2842740527 分钟前
电气控制与PLC·HMI触摸屏组态与自动伸缩门控制系统 CSDN发布稿
笔记·学习·自动化
xier_ran1 小时前
【infra之路】AI 编译器学习笔记(七):Linalg 与 Tiling——把迭代空间切成块
人工智能·笔记·学习