记录我的Vue学习

这篇博客记录了一位实习生从C++后台转到使用Vue.js进行前端开发的学习过程。主要讨论了Vue的核心特性,如v-bind、v-if/v-show、v-for、v-on/@click、v-model、自定义组件、v-text和v-html等,并通过实例展示了这些指令的用法。还提到了Vue的cdn引用和对象深拷贝。博客作者分享了对Vue理解和应用的初步体验。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在腾讯实习,面的C++后台,但新开了个项目需要用js来做后台,最近我的实习期也要结束了,摸摸鱼学学vue,嘿嘿,主要记录自己对vue的理解,本篇基于vue官方文档学习的,如果不对可以及时指出。官网链接

用的cdn是vue官网上给的https://cdn.jsdelivr.net/npm/vue/dist/vue.js

  1. v-bind绑定个值

2.v-if 为true就可以显示,false就不会显示了,他还有个好兄弟是v-show。频繁切换使用v-show,不频繁切换使用v-if
在这里插入图片描述

3.v-for
相当于C++的for(auto val : nums),按照todos的顺序把值都输出来
在这里插入图片描述

  1. v-on:click 绑定一个函数,一开始显示初始值,点击一下变haha~点下复位变回去。

v-on的简写用@来表示
<button @click="oneClick">单击简写</button>
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
6. v-model双向选择,在框里输入,直接也显示出来了。为什么叫双向选择器呢?因为既可以修改当前也同时修改了app-6里的data中message中的值。这样叫做双向
在这里插入图片描述
在这里插入图片描述
6.自定义个小标签,至今没体会到好处哈哈哈哈,慢慢探索
在这里插入图片描述

7.如果指向的是$data也是vue里的。

8.Object.freeze()这样,就是深拷贝了而不是浅拷贝了

  1. $是为了区分是vue提供的还是用户自己提供的

10.v-text可以替换{{}},值还是绑死的,更加稳定,不会像{{}}变来变去

11.v-html,可以贴一个标签
在这里插入图片描述

12.v-bind的缩写就是:这样的一个冒号,比如v-bind:src可以简写成:src,这样src也可以使用vue对象里的元素了。

13.@keyup表示按某些特殊键代表返回
在这里插入图片描述

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值