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

相关推荐
math_hongfan13 小时前
鸿蒙多模态AI交互高级:图文+语音+手势融合交互/多模态大模型端侧适配/跨模态检索高阶实战
人工智能·学习·华为·交互·语音识别·harmonyos·鸿蒙
fthux13 小时前
MCP协议开发实战:从零搭建AI Agent工具链
前端·人工智能·ai·开源·github
旖旎夜光13 小时前
C++(类与对象)(下)
开发语言·c++·学习
math_hongfan13 小时前
鸿蒙AI应用性能高级评测:推理延迟/内存占用/功耗/准确率四维指标评测体系与极致调优方案
人工智能·学习·华为·harmonyos·鸿蒙
zho_uzhou13 小时前
ubuntu服务端运行vue网页步骤
linux·服务器·vue.js·ubuntu
黄贵根19 小时前
JavaScript实现教培行业意向登记系统
开发语言·javascript·ecmascript
codeGoogle1 天前
自研 IM 还是选择第三方 SDK?企业开发者应该如何权衡?
前端·后端·程序员
zzzzzz3101 天前
从 react-bits 看动效组件化:别把视觉效果写成一次性页面代码
javascript·react.js·开源
用户938515635071 天前
React Context 与自定义 Hook 从底层到实践:「跨层级通信 + 副作用封装」全解析
前端·javascript·react.js