![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue学习笔记
qq_41937087
这个作者很懒,什么都没留下…
展开
-
vue学习 vue-router
路由知识:这里又涉及到了当初计算机网络中的内容:公网 -> 调制解调器 -> 路由器 -> 电脑在内网中,怎么知道公网中传过来的信息是发送给哪个计算机的呢:在路由器中有一个映射表,就是内网的IP地址:对应着电脑的唯一标识(也就是mac地址),通过映射表正确转发。前端渲染和后端渲染、前端路由和后端路由:1、后端渲染阶段后端路由阶段2、前后端分离阶段:访问过程:得到url之后,先去静态资源服务器获得html、css、js下载下来,再通过ajax去API服务器下载来具体的数据。原创 2020-07-22 08:51:43 · 192 阅读 · 0 评论 -
ES6中import和export的基本使用
ES6中import和export的基本使用相对于ES5,ES6自带模块化思想。在html文件中使用script标签导入js文件时,加上type属性并设置为module。<script src="main.js" type="module"></script>这个js文件就会成为一个独立的模块。而在这些独立的模块之间复用资源就需要进行导入和导出。1、export导出①定义了就直接导出:// 导出变量export var name= 'bsy';export var yea原创 2020-06-25 16:02:17 · 553 阅读 · 0 评论 -
vue学习笔记v-model(45-50)
vue学习笔记v-model(45-50)vue中的v-model实现了数据的双向绑定v-model的原理(双向绑定):v-model实际上是一个语法糖,他背后包含了两个操作:1、v-bind给输入框绑定一个value属性:渲染时值为value2、v-on指令给当前输入框绑定一个事件:输入时改动value属性所以说:<input type="text" v-model="message">相当于<input type="text" :value="message" @input原创 2020-06-23 15:24:10 · 195 阅读 · 0 评论 -
vue中常用的三种js高阶函数(filter/map/reduce)
介绍三个js中数组使用的高阶函数 filter、map、reduce1、filter函数:作用:对数组进行过滤传入值:需要传入一个返回布尔值的函数作为过滤标准返回值:返回一个过滤之后的数组例子:array2 = array1.filter(function(n){ return n < 100;})基本就是对一个数组进行传入函数对数组内的每个值进行判断,如果这个值让函数的返回值为true,就把它加入到过滤后的数组中,否则不加入。2、map函数:作用:映射操作,具体说就是对数组原创 2020-06-23 13:31:26 · 1284 阅读 · 1 评论 -
vue学习笔记 数组中的响应式方法
vue学习笔记 数组中的响应式方法在数组中常用的响应式方法:1、push方法从数组的最后添加元素,可以是一个元素也可以是多个元素。例子:array.push("elem1");array.push("elem1", "elem2", "elem3", "elem4");2、pop方法删除数组的最后一个元素。例子:array.pop();3、unshift方法从数组的前面添加元素,可以是一个或多个。例子:array.unshift(elem1);array.unshift(e原创 2020-06-02 10:58:32 · 726 阅读 · 0 评论 -
vue学习笔记 循环遍历v-for
vue循环遍历v-for1、v-for遍历数组只获取元素值时:<li v-for="item in books">{{item}}</li>例子:<div id="div1"> <ul> <li v-for="item in books">{{item}}</li> </ul></div>// books: ['《132》', '《213》', '《321》', '《123》']获原创 2020-05-29 10:32:57 · 481 阅读 · 0 评论 -
vue学习笔记 条件判断
vue学习笔记 条件判断1:v-if、v-else-if、v-else基本用法:// condition的类型为Boolean值 <h2 v-if="condition1">情况1</h2> <h2 v-else-if="condition2">情况2</h2> <h2 v-else->情况3</h2>注: v-if、v-else-if、v-else多用在比较简单的逻辑判断上,比如说根据session来判断是不是要原创 2020-05-27 10:47:54 · 422 阅读 · 0 评论 -
vue学习笔记29-31(v-on)
vue学习笔记29-31(v-on)1、作用绑定事件监听器,与用户进行交互2、基本用法 <button v-on:click="increment()">+</button>例子:(计数器例子)<div id="div1"> <h2>{{counter}}</h2> <button v-on:click="increment()">+</button> <button v-on:click原创 2020-05-20 12:02:59 · 143 阅读 · 0 评论 -
ES6初级知识补充
ES6语法补充1、var和let从一定意义上说let是更加完美的var2、作用域之间的不同ES5中的for和if没有定义域属性,但在ES6当中加上了对for和if定义域属性原创 2020-05-20 10:33:25 · 112 阅读 · 0 评论 -
vue学习笔记21-25(计算属性)
vue学习笔记21-25(计算属性)vue中的计算属性(computed)1、什么是计算属性注:计算属性的命名规范,它首先是一个属性,所以最好按照一个属性来进行命名,使用名词进行命名,不要加入动词。再注:在mustache语法中不要加上小括号,因为这是属性而不是函数,例子:<h2>{{fullName}}</h2>2、作用对要是用的数据首先进行一定的处理,方便使用,简化上方mustache中的内容,增强可读性。3、使用举例①简单使用(只读属性)简单实用只使用了其中的原创 2020-05-19 11:14:48 · 339 阅读 · 0 评论 -
vue学习笔记12-20
mustache语法用于从data中取出变量对应数据,进行标签内容的显示v-bind用于将变量对应数据进行属性的赋值:v-bind语法糖: :(冒号)例子: <a v-bind:href="ahref"></a>相当于<a :href="ahref"></a>注:class的绑定同理v-bind动态绑定class属性:class在使用v-bind时,多在class内容中加上一个对象,对象内为 类型名:布尔值(也就是当布尔值为1时,包含这个类名原创 2020-05-15 17:50:28 · 84 阅读 · 0 评论