2021年7月8日

vue中使用slot

摘要: 1、作用:使组件具有扩展性。插槽内展示的东西由使用者决定。 2、如何封装:抽取共性,保留不同。 3、<slot></slot> 4、默认值:<slot><button></button></slot>,如果引用的地方传了别的东西就会覆盖掉,没传就是默认值。 5、具名插槽:给插槽起名字,替换的时候根据 阅读全文

posted @ 2021-07-08 08:54 代码改变世界001 阅读(156) 评论(0) 推荐(0)

2021年7月7日

vue父子组件访问方式

摘要: 1、父组件访问子组件:this.$children,拿到所有子组件的集合对象,通过这个对象访问子组件的方法或者属性。用的少。 2、父组件访问子组件:this.$refs,用的多。 要点: 组件上加ref="aaa" this.$refs.aaa 3、子组件访问父组件:this.$parent,基本不 阅读全文

posted @ 2021-07-07 19:07 代码改变世界001 阅读(93) 评论(0) 推荐(0)

vue子组件改变父组件值--写法2

摘要: 1、父:要点 正常父传子:msg="oldValue" 正常子接父@iClick="yClick" <template> <div id="app"> <HelloWorld @iClick="yClick" :msg="oldValue"/> </div> </template> <script> 阅读全文

posted @ 2021-07-07 18:56 代码改变世界001 阅读(72) 评论(0) 推荐(0)

vue子组件改变父组件值--写法1

摘要: 1、父:要点 正常父传子:msg="oldValue" 正常子接父@iClick="yClick" <template> <div id="app"> <HelloWorld @iClick="yClick" :msg="oldValue"/> </div></template><script>im 阅读全文

posted @ 2021-07-07 18:46 代码改变世界001 阅读(103) 评论(0) 推荐(0)

vue父子组件通信

摘要: 1、有一些数据需要从上层传递到下层,这个时候是不会让子组件去发送网络请求的,而是直接让父组件将数据传递给子组件。 2、父组件向子组件传递数据,通过props属性。 父 子 3、子组件向父组件传递数据,通过自定义事件$emit。 子,通过自定义事件触发,事件名iClick。 父,通过@iClick接收 阅读全文

posted @ 2021-07-07 17:18 代码改变世界001 阅读(46) 评论(0) 推荐(0)

VUE组件化思想

摘要: 1、它提供了一种抽象,让我们可以开发出一个个独立可复用的小组件来构造我们的应用。 2、任何应用都会被抽成一个组件树。 3、尽可能将页面拆分成一个个小的、可复用的组件,这样我们的代码更加方便组织管理,并且扩展性也更强。 4、组件使用: 创建组件构造器。 注册组件。 使用组件。 5、全局组件和局部组件。 阅读全文

posted @ 2021-07-07 13:55 代码改变世界001 阅读(196) 评论(0) 推荐(0)

vue中v-model的使用

摘要: 1、数据双向绑定。其实就是两个指令的集合。v-bind:value=""和v-on:input=""。 2、单选多选时v-model都是绑定同一个变量。 3、值绑定: <label v-for="item in list" :for="item" :key="item"> <input type=" 阅读全文

posted @ 2021-07-07 10:34 代码改变世界001 阅读(576) 评论(0) 推荐(0)

vue数组中哪些方法是响应式的

摘要: push() 在数组最后元素中追加元素。 pop() 删除数组最后一个元素。 shift() 删除数组中第一个元素。 unshift() 在数组前面元素中追加元素。 splice() 删除、插入、替换元素。 sort() 排序。 reverse() 反转。 阅读全文

posted @ 2021-07-07 09:42 代码改变世界001 阅读(153) 评论(0) 推荐(0)

vue中v-for的使用

摘要: 1、遍历数组: <li v-for="(item, index) in list" :key="index">{{ index + 1}} -- {{ item }}</li> 2、遍历对象: <li v-for="(value, key) in obj" :key="key">{{ value } 阅读全文

posted @ 2021-07-07 09:30 代码改变世界001 阅读(139) 评论(0) 推荐(0)

vue中v-if与v-show的区别以及使用场景

摘要: 区别 1.手段:v-if是通过控制dom节点的存在与否来控制元素的显隐;v-show是通过设置DOM元素的display样式,block为显示,none为隐藏; 2.编译过程:v-if切换有一个局部编译/卸载的过程,切换过程中合适地销毁和重建内部的事件监听和子组件;v-show只是简单的基于css切 阅读全文

posted @ 2021-07-07 09:05 代码改变世界001 阅读(567) 评论(1) 推荐(0)

导航