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

相关推荐
iamtsfw38 分钟前
记录:express router,可以让node.js后端文件里的路由分布的更清晰
前端·node.js
黑匣子~1 小时前
Vue 3 官方 Hooks 的用法与实现原理
前端·javascript·vue.js
Yvonne爱编码1 小时前
CSS-5.1 Transition 过渡
前端·css·状态模式·html5·hbuilder
恰恰兄2 小时前
webpack性能优化
前端·webpack·node.js
23级二本计科2 小时前
对Web界面进行简单自动化测试Selenium
前端·数据库
海尔辛2 小时前
学习黑客了解密码学
学习·密码学
霍志杰3 小时前
iframe加载或者切换时候,短暂的白屏频闪问题解决
前端·javascript·chrome
ShallowLin3 小时前
HarmonyOS学习——UIAbility组件(下)
学习
李小白664 小时前
论坛系统(中-2)
前端
.小墨迹4 小时前
Python学习——执行python时,键盘按下ctrl+c,退出程序
linux·开发语言·python·学习·自动驾驶