逆战关于Vue学习的一点心得

vue


Vue

什么是Vue

  1. Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架。
  2. Vue 只关注视图层, 采用自底向上增量开发的设计
  3. Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
  4. 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

回到顶部