逆战关于Vue学习的一点心得
Vue
什么是Vue
- Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架。
- Vue 只关注视图层, 采用自底向上增量开发的设计
- Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
vue学习" title="vue学习">vue学习非常简单(嘻嘻)
常用模板语法有 v-model(表单数据双向绑定),v-if(条件渲染),v-on(事件绑定),v-bind(属性绑定),v-for(循环),接下来将重点记录下v-bind和v-on的一些问题
虚拟dom
真实的dom解析为:创建DOM树——创建StyleRules——创建Render树——布局Layout——绘制Painting
虚拟dom的好处,这就意味着你每创建一个标签,你的浏览器就会自上而下的进行一次再刷新创建,这样会使得浏览器再处理多个标签的时候影响浏览的效用,而vue基于这一点进行优化,虚拟dom存储在内存之中,再将新的修改值与旧的进行比较之后有差异则再进行修改添加,减小了修改的次数
Vue生命周期
vue每个组件都是独立的,每个组件都有一个属于它的生命周期,从一个组件创建、数据初始化、挂载、更新、销毁,这就是一个组件所谓的生命周期。在组件中具体的方法有:
beforeCreate:第一次对状态进行修改。
created:数据的初始化工作
beforeMount: 可以对数据进行一次更改,但也是最后一次机会,但是无法访问到我们状态的对应节点
mounted:已经可以对数据进行访问,多用于ajax请求等问题
beforeUpdate:更新之前
updated:更新之后可以对dom进行访问,可以用来处理一些关于异步的问题
beforeDestroy:销毁之前,可以对销毁再进行一些修改
destroyed:完全销毁,新的轮回将产生
关于vue周期,也许下次会进行更多的笔记处理
过滤器
vue.filter(“自定义名字”,(回调函数/方法)=>{
return:
})
固定写法没什么好书的,就是记得一定要是return,过滤器可以进行多次级别的调用,也可以传递参数 ,或者一个标签里面可以多个过滤器并存
组件封装
运用脚手架以后会时常用到的一个东西
全局封装:Vue.component(“自定义属性标签名字”){
template:“这里写定义的方式”}
这样你就可以使用一个有自己定义出来的标签了,但一定要写在new.Vue的前面,组件是一个孤岛,无法访问到外部作用域,只能写到自己内部的地方,
1.组件内部 可以有computend,metho,data等方法,但必须有一个返回值
随便引用一个功能的例子,人懒不想写咧子,后面看心情补充
2.组件的外层必须有一个root element也就是根组件,只能有一个,但里面可以套多个,不可并列(说白了外面必须套皮)不然有可能会出现无限刷新的问题(后面脚手架里面可能会多次遇到)
3.父子组件不能共享(脚手架里面他两可能永远见不到面,后面再说)
4.组件内部可以进行复写组件 ,构成父子关系(还是脚手架这东西好用,多创建个vue的事情)
局部定义组件
定义在component里面,只能给当前组件进行使用,不能在全局中进行使用,只有自己一个
调用属性的时候需要使用props[ ]固定写法 来进行访问,也就是父传子
属性验证:props[ ] 是支持对数据类型来进行定义的,父传子通过属性来传,驼峰命名的话中间要加横杠
$emit可以将子组件里面的东西传递给父组件
差不多就是这些基础东西了,如有不足或错误,那肯定是上课没注意,如果文章看不懂,无所谓反正我也是写我自己看的 欢迎意见,指责。
以上是 逆战关于Vue学习的一点心得 的全部内容, 来源链接: utcz.com/z/374773.html