- 博客(16)
- 收藏
- 关注
RSS订阅原创 14.nextTick重点
组件中的6种通讯方式1.props和$emit2.$refs3.children和parent4.vuex5.attrs和linsteners6.provide和inject父孙通讯 重点 attrs和insteners provide提供 和inject依赖注入 并不是响应式 组件通讯 vuex的使用1.安装 vue ui-->npm install vuex vue add vuexstate 是存放数据的mutations 用于改变state中存放的数据，相当于页面中的me
2022-06-28 17:05:26
288
5
原创 13.nextTick的使用
在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。所以就衍生出了这个获取更新后的DOM的Vue方法。所以放在Vue.nextTick()回调函数中的执行的应该是会对DOM进行操作的 js代码；理解：nextTick()，是将回调函数延迟在下一次dom更新数据后调用，简单的理解是：当数据更新了，在dom中渲染后，自动执行该函数，nextTick和$nextTick区别1.nextTick(callback)：当数据发生变化，更新后执行回调。在下次 DOM
2022-06-28 16:57:51
1586
原创 12.脚手架todolist
用脚手架写todolist 分为父组件和子组件js和css部分一开始觉得脚手架是很难的事情 但是通过todolist这个小例子 好像就打通了一点思路
2022-06-28 16:52:47
142
原创 11.vue脚手架
vue脚手架指的是vue-cli，它是一个专门为单页面应用快速搭建繁杂的脚手架，它可以轻松的创建新的应用程序而且可用于自动生成vue和webpack的项目模板。Vue是一个用于构建用户界面的渐进式框架。它是可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或者现有的项目进行整合。 另一方面当与现代化的工具链以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用提供驱动，接下来将介绍Vue中的一个重要内容vue-cli，就有一定的参考价值，希望对大家有所帮助。 vue-c
2022-06-28 14:16:02
166
原创 10.插槽的使用
1.什么是插槽？插槽的指令为v-slot，它目前取代了slot和slot-scope，插槽内容，vue实例一套内容分发的api，将slot元素作为承载分发内容的出口。2.具名插槽的三种写法插槽可以是任意内容：插槽就是Vue实现的一套内容分发的API，将元素作为承载分发内容的出口。没有插槽的情况下，在组件标签内些一些内容是不起任何作用的，当我在组件中声明了slot元素后，在组件元素内写的内容就会跑到它这里了！...
2022-06-28 14:06:48
727
原创 8.MVVM模型的理解
MVVM是Model-View-ViewModel的简写。它本质上就是MVC 的改进版。MVVM 就是将其中的View 的状态和行为抽象化，让我们将视图 UI 和业务逻辑分开。当然这些事 ViewModel 已经帮我们做了，它可以取出 Model 的数据同时帮忙处理 View 中由于需要展示内容而涉及的业务逻辑。...
2022-06-28 13:51:52
289
原创 7.认识vue，父子组件的相互通讯
1.尽量不要直接使用props里面的值进行页面渲染2.接收的数据类型可以是多个的例如type:[Number,String]3.父子组件的相互通讯
2022-06-27 14:26:18
60
原创 6.认识vue Data
Data为什么必须是一个函数？根实例对象data可以是对象也可以是函数，不会产生数据污染情况.组件中的data必须是一个函数因为组件中的data如果是一个对象的话, 对象A的值发生改变,对象B的值也会跟着改变但是,组件中的data是一个函数的话,不会产生这样的问题这样的好处是,不会受到其他实例对象数据的污染.组件中data必须为函数，目的是为了防止多个组件对象之间共用一个data，产生数据污染。vue中组件是用来复用的，为了防止data复用，将其定义为函数。因为当 data 是函数时，组件实例化的时
2022-06-27 14:21:47
313
原创 VUE生命周期图示
vue实例从创建到销毁的过程，就是生命周期。也就是从创建开始、初始化数据、编译模板、挂载DOM->渲染、更新->渲染、卸载等一系列过程。图示：带有中文翻译图示： 生命周期总结beforecreate : 可以在这加个loading事件created ：在这结束loading，还做一些初始数据的获取，实现函数自执行mounted ： 在这发起后端请求，拿回数据，配合路由钩子做一些事情beforeDestroy： 你确认删除XX吗？destroyed ：当前组件已被删除，清空相关内容...
2022-06-05 17:36:53
243
原创 学习VUE第五天.
01.购物车案例 <div id="app"> <div v-if="books.length>0"> <table> <thead> <th> </th> <th>书籍名称</th> <th>出版日期</th> <th>价格</th> <th&g
2022-05-26 11:36:17
97
原创 学习VUE的第四天.
01.v-on的基本使用.<body> <div id="app"> <h2>{{count}}</h2> <button type="button" @click="add()">+</button> <button type="button" @click="sub()">-</button> </div> <script src="vu
2022-05-24 19:09:50
72
原创 学习VUE的第三天
今天学习了计算属.性与侦听器的使用.01.计算属性的基本使用<div id="app"> <h2>{{firstName}}-{{lastName}}</h2> <h2>{{getFullName()}}</h2> <h2>{{fullName}}</h2><!-- 计算属性在页面渲染时 不需要加() --> </div> <script src="vue.j
2022-05-24 10:50:11
69
原创 初学Vue第二天...
记录学习vue的第二天~比昨天稍微深入一些.也复杂一些.今天主要学的是v-bind动态绑定class对象/数组 & v-for和v-bind的结合 & v-bind动态绑定style对象/数组语法.01.v-bind动态绑定class对象,(案例:点击按钮切换字的颜色) <style> .active{ color: yellowgreen; } </style></head>
2022-05-19 17:29:42
172
原创 认识Vue的第一天
<script src="vue.js"></script> <script> const app = new Vue({//声明一个vue的实例化对象 el: '#app',//el用于挂载需要管理的元素 data() {//是页面存放的数据 return { msg: '我在学习vue', .
2022-05-19 13:35:06
84
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人