![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue2+3
分享vue2、3学习的笔记
Wikp~
记录大学学习历程
展开
-
05_MVVM模型
简述MVVM MVVM模型在Vue中的体现,大致是如下的对应关系: M:模型(Model):对应data中的数据 V:视图(View):模板 VM:视图模型(ViewModel):Vue实例对象 放到实际的代码中,大致就是如下关系: 总结 MVVM模型 1.M:模型(Model) : data中的数据。 2.V:视图(View) : 模板代码。 3.VM:视图模型(ViewModel) : Vue实例。 观察发现: 1.data中所有的属性,最后都出现在了vm身上。 2.vm身上所有的属性及 Vue原创 2022-02-24 15:30:17 · 546 阅读 · 0 评论 -
04_el与data的两种写法
我们之前常见的 el 和 data 书写方法是运用如下方式来与容器进行关联的: 但是其实 el 还有另外一种写法,这两者是可以视情况选择的,如下图: 同样的, data 实际上也有另外一种写法,之前我们使用的data写法其实是一种对象式写法,然而data其实还有一种写法,叫做函数式写法,这种写法在之后组件的学习中会非常常用: 其中这个function并不是data调用的,而是Vue帮忙调用的,因此如果我们输出this的话会输出Vue的实例对象。 当然,写function毕竟还是比较麻烦的,我们一般写的原创 2022-02-24 10:59:19 · 568 阅读 · 0 评论 -
03_数据绑定
日常小技巧/注意项记录 换行: 前言 我们在之前其实就已经利用 “ v-bind ” 做过了数据绑定的操作: 但是今天的数据绑定和之前 v-bind 的绑定还是有所不同的,会比它更加的高级。 单向数据绑定 之前我们所使用的利用 v-bind 进行数据绑定的方式其实就是单向数据绑定,这也是利用 v-bind 进行绑定的特点之一。 <div id="root"> 单向数据绑定:<input type="text" v-bind:value="name"><br原创 2022-02-23 00:39:27 · 155 阅读 · 0 评论 -
02_Vue模板语法
日常小技巧记录 分隔线: Vue模板语法的两大类 插值语法 —— {{}} 指令语法 插值语法 插值语法上一节就用过,大致的形式如下,在容器中是由双大括号展现的: 模板语法原创 2022-02-21 17:09:36 · 374 阅读 · 0 评论 -
Vue中值得注意的几个小细节①
这里会记录一些Vue学习中的小知识点: Vue实例和容器只能是一一对应的,不存在多对一或者一对多的情况,否则会出现报错。 现在刚接触用的都是比较基础的vue用法,当之后数据量大了之后,例如容器中存在上百个动态数据,可以使用组件来为vue分流。 注意区分:js表达式和js代码(语句) , 插入语法“ {{}} ”中只能存放js表达式。 ①表达式:一个表达式会产生一个值,可以放在任何一个需要值的地方: (1)a —— 变量 (2)a+b —— 运算表达式 (3)demo(1) —— 函数调用表达式 (4)x原创 2022-02-08 13:48:13 · 188 阅读 · 0 评论 -
01_hello案例
实用快捷键 ① " !+ tab " 调用html主题结构。 ② " div # id + tab " 可以直接出现带指定id的div结构。原创 2022-02-06 08:30:50 · 90 阅读 · 0 评论 -
开始前的准备,Vue环境配置
Vue的安装方式: 直接用script引入(推荐)。 运用NPM和命令行工具来搭配引入。 引入Vue 如图新建文件,并在指定位置中引入下载的js包: 在html文件中引入vue: <!--引入Vue--> <script type="text/javascript" src="../js/vue.js"></script> 成功引入后我们可以打开该html对应的页面,并按f12在Console中看到如下的反馈: 下载Vue的开发者工具原创 2022-01-18 16:31:35 · 7928 阅读 · 0 评论 -
Vue基础概念
Vue的特点 采用组件化模式,提高代码复用率、且让代码可以更好的维护。 声明式编码,让编程人员无需直接操作DOM,进而提高代码的开发效率。 使用了虚拟DOM+Diff算法,从而尽可能的复用DOM节点。示例如下: Vue官网一些值得留意的模块 “API” —— 遇到不会的方法可以在这里面查询。 “Cookbook” —— 官方推荐的一些不错的小技巧。 “工具” 和 “核心插件” ——后期进一步学习所需要留意的,例如“ ‘Vue CLI’ :脚手架的使用 ” 等。 “Awesome Vue”、“浏览和原创 2022-01-17 18:59:02 · 482 阅读 · 0 评论