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 的当前值。

相关推荐
The_Uniform_C@t27 分钟前
PWN | 对CTF WIKI的复现+再学习 (第八期)
网络·学习·网络安全·二进制
前路不黑暗@1 小时前
Java项目:Java脚手架项目的登录认证服务(十三)
java·spring boot·笔记·学习·spring·spring cloud·maven
前路不黑暗@2 小时前
Java项目:Java脚手架项目的 C 端用户服务(十五)
java·开发语言·spring boot·学习·spring cloud·maven·mybatis
Hello_Embed3 小时前
Modbus 传感器开发:STM32F030 libmodbus 移植
笔记·stm32·学习·freertos·modbus
知识分享小能手4 小时前
SQL Server 2019入门学习教程,从入门到精通,SQL Server 2019 视图操作 — 语法知识点及使用方法详解(16)
sql·学习·sqlserver
_Eleven4 小时前
Tailwind CSS vs UnoCSS 深度对比
前端
NEXT064 小时前
TCP 与 UDP 核心差异及面试高分指南
前端·网络协议·面试
qq_24218863324 小时前
HTML 全屏烟花网页
前端·html
曲幽4 小时前
FastAPI实战:WebSocket长连接保持与心跳机制,从入门到填坑
javascript·python·websocket·keep-alive·fastapi·heartbeat·connection