- 博客(22)
- 资源 (3)
- 问答 (1)
- 收藏
- 关注
原创 vue.js之父子组件的访问方式
父组件访问子组件时,使用2种方法。1、$children,获取该子组件下所有内容,子组件使用几次,就获取几次2、$refs获取的是对象类型,默认是一个空对象,只获取子组件上带属性 ref=’’ 的子组件的内容。示例: <!--父组件--> <div id="app"> <cpn></cpn> <!--子...
2020-05-07 21:47:59 179
原创 vue.js之子组件向父组件传值(参)
props用于父组件向子组件传递数据,子组件向父组件传值则是使用自定义事件来完成。 自定义事件的流程: 1.在子组件中,通过$emit()来触发事件。 2.在父组件中,通过v-on来监听子组件定义的事件。示例:<!--父组件--> <div id="app"> <!--监听子组件定义的事件,获取传过的参数,这里的事件忽略括号-->...
2020-05-06 21:21:24 195
原创 vue.js之父子组件的通信
父子组件的通信,传值通过组件的props属性,Prop 是你可以在组件上注册的一些自定义 attribute。当一个值传递给一个 prop attribute 的时候,它就变成了那个组件实例的一个 property。父传子:1:props使用数组,里面存变量 <div id="app"> //变量绑定到子组件的标签上,v-bind:pros数组里的变量名="传的参数的变量...
2020-04-29 22:40:29 132
原创 vue.js的组件的data属性
每个组件也像每个Vue实例拥有自己的data属性和methods方法<div id="app"> <cpn></cpn> </div> <template id="cpn"> <div> <h2>我是组件</h2> <h3>目前计数:{{co...
2020-04-28 23:38:51 399
原创 vue.js的组件模板抽离的写法
上代码演示:<div id="app"> <cpn1></cpn1> <cpn2></cpn2> </div> <!--组件模板抽离的第一种写法--> <script type="text/x-template" id="cpn1"> <div> ...
2020-04-28 22:33:12 499 1
原创 vue.js的组件之父子组件
父子组件的区别 <div id="app"> <cpn2></cpn2> </div> <script> //构造子组件 const cons1 = Vue.extend({ template: '<div><h2>我是子组件</h2></div>...
2020-04-28 22:21:39 178
原创 vue.js的组件的基本使用
全局组件和局部组件<div id="app"> <!--第三:使用组件--> <cpn></cpn> </div> <div id="app2"> <!--第三:使用组件--> <cpn></cpn> </div> <s...
2020-04-28 20:45:10 171
原创 vue基础之v-model的修饰符
v-model的三个修饰符:1…lazy取代 input 监听 change 事件,让input框在失去焦点或者按enter时才会更新数据:2…number 输入字符串转为有效的数字:3…trim 过滤掉输入内容的首尾空格:<div id="app"> <!--v-model修饰符--> <!--1..lazy取代 input 监听 chang...
2020-04-27 21:45:09 234
原创 vue基础之v-model双向数据绑定原理的浅层解析
可以用 v-model 指令在表单 、 及 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇,但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据,并对一些极端场景进行一些特殊处理。示例:<!--双向数据绑定--> <div id="app"> <!--v-model指令表单双向数据绑定-->...
2020-04-26 22:50:46 203
原创 vue基础之响应式和非响应式的数组方法
示例:<div id="app"> <ul> <li v-for="item in moveList">{{item}}</li> </ul> <button @click="changeList">点击修改</button> </div> <scri...
2020-04-23 22:10:38 465 1
原创 vue基础之v-for列表循环
v-for 指令基于一个数组来渲染一个列表。v-for 指令需要使用 item in items 形式的特殊语法,其中 items 是源数据数组,而 item 则是被迭代的数组元素的别名。示例:<div id="app"> <!--循环数组不带索引--> <ul> <li v-for="item in moveList"&g...
2020-04-23 21:41:07 829
原创 vue基础之v-if和v-show的区别
官方说明:v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。相比之下,v-show 就简单得多——不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 进行切换。一般来说,v-if 有更高的切换开销,而 v-show ...
2020-04-23 20:56:48 94
原创 vue基础之v-if条件渲染
v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染。1.v-if=“布尔”,如果为true,就显示当前内容, v-else否则就隐藏。<div id="app"> <h2 v-if="true">同学们好啊</h2> <h2 v-else>老师好</h2></div&g...
2020-04-22 22:30:17 1109
原创 vue基础之v-on修饰符
v-on修饰符。用在普通元素上时,只能监听原生 DOM 事件。用在自定义元素组件上时,也可以监听子组件触发的自定义事件。示例:1.stop 调用event.stopPropagation阻止冒泡<div id="app"> <div @click="parentClick"> aaaa <button @click.stop="...
2020-04-22 21:59:13 124
原创 ES6基础之let和const的定义
1.letES6新增了 let 命令,用来声明变量,用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。接下来做个练习来解释 let 和 var的区别。 变量作用域 { var name = 'who'; let a = 10; } console.log(name); //打印who console.log(a...
2020-04-20 22:04:42 174
原创 vue基础之计算属性computed
计算属性将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。<div id="app"> <h2>第一种方法拼接字符串---{{lastName + ' ' + firstName}}</h2> <h2>第二种拼接字符串---{{lastName}} {{firstNam...
2020-04-19 21:59:33 192
原创 vue基础之动态绑定属性v-bind指令
v-bind,动态地绑定一个或多个 attribute,或一个组件 prop 到表达式。 <div id="app"> <a href="http://www.baidu.com">百度一下</a> <br> //和上面a标签中的href属性赋值一样的效果 //v-bind:加属性名=“变量名” &...
2020-04-19 16:39:59 607
原创 vue基础之生命周期函数
官方文档解释得很到位,当然要有自己的解释。生命周期顾名思义就是从生命的出生到死亡的过程。vue生命周期可以理解为:从事件的创建到销毁的过程。话不多说,图来~~标题生命周期函数在开发中应用非常广泛,面试的时候也是大概率会面到,必须要掌握,牢记(提醒自己!!!)。...
2020-04-18 16:49:07 110
原创 Vue.js初体验(基础指令的使用)
v-oncev-once指令,只渲染元素和组件一次。随后的重新渲染,元素/组件及其所有的子节点将被视为静态内容并跳过。<div id="app"> <h2>{{msg}}</h2> <h2 v-once>{{msg}}</h2><!--此处的数据只渲染一次,v-once指令的作用--></div><...
2020-04-18 16:38:00 105
原创 Vue.js初体验(基础数据绑定)
基础数据绑定1、引入vue.js后,然后进行Vue实例化。new Vue(object);<div id="app"> <!--普通字符串数据绑定--> <h3>{{msg}}</h3> <!--数据渲染为app.data中的msg:欢迎使用Vue.js--> <h3>{{count}}</h...
2020-04-18 16:15:00 82
原创 Vue.js初体验(引入Vue.js)
一、 新建一个html,在script标签引入Vue.js **第一种方法**: 在官方网站下载vue.js到本地然后引入,[vue.js](https://cn.vuejs.org/) **第二种方法**: 使用 CDN 方法 以下推荐国外比较稳定的两个 CDN,国内还没发现哪一家比较好,目前还是建议下载到本地。 Staticfile CDN(国内) : https:/...
2020-04-17 23:35:23 401
原创 从0开始学Vue.js(CPL笔记)
从0开始学Vue.js(CPL笔记)这是我在b站看视频边学习边做的笔记,希望能让自己不断进步,附上视频地址学习框架前,最好有js的ES5、6和TypeScript的基础。这是我在b站看视频边学习边做的笔记,希望能让自己不断进步,附上视频地址https://www.bilibili.com/video/BV15741177Eh?p=2学习框架前,最好有js的ES5、6和TypeScript的基...
2020-04-15 22:43:56 99
Webpack原理剖析.zip
2020-04-22
Killw3wp.exe
2020-04-20
RestartIIS.exe
2020-04-19
商城横向分类导航,最后一级框架样式问题
2018-10-19
TA创建的收藏夹 TA关注的收藏夹
TA关注的人