Vue中v-model基本使用
默认情况下,一个组件的 v-model 会使用 value prop 和 input 事件。但是诸如单选框、复选框之类的输入类型可能把 value 用作了别的目的。
v-model 是 Vue2 中唯一支持双向绑定的指令,用于表单控件绑定,但不代表它只能用在表单控件之上。在文档 使用自定义事件的表单输入组件 一节中提到了, v-model 其实是个语法糖。
Vue实例,在初始化的时候,会将对象身上的所有数据,做响应式处理,之后再向对象中添加属性,这些属性就不再具备响应式能力了。
Vue路由的使用
1、vue-router 使用 path-to-regexp 作为路径匹配引擎,所以支持很多高级的匹配模式,例如:可选的动态路径参数、匹配零个或多个、一个或多个,甚至是自定义正则匹配。
2、第一种方法 页面刷新数据不会丢失 需要对应路由配置如下:可以看出需要在path中添加/:id来对应 $router.push 中path携带的参数。
3、Vue -router 是为了配合Vue.js 构建单页面应用而存在的,在使用方面,我们需要做的是,将组件映射到路由,然后告诉Vue-router 在哪里渲染它们。
4、可在main.js或者在src中新建router文件夹专门放设置路由的js中引入vue-router:$router就是当前项目中的路由器对象,它的push方法,用于跳转路由 replace方法,也是用于跳转路由。
5、router-link组件支持用户在具有路由功能的应用中 (点击) 导航。 通过to属性指定目标地址,默认渲染成带有正确链接的标签,可以通过配置tag属性生成别的标签.。
6、通常我们在vue项目中都是前端配置好路由的,但在一些项目中我们可能会遇到权限控制,这样我们就涉及到 动态路由 的设置了。动态路由设置一般有两种 :(1)、简单的角色路由设置:比如只涉及到管理员和普通用户的权限。
【Vue】vue基础知识一(本地数据操作)
Vue 在更新 DOM 时是异步执行的。只要侦听到数据变化,Vue 将开启一个队列,并缓冲在同一事件循环中发生的所有数据变更。如果同一个 watcher 被多次触发,只会被推入到队列中一次。
MVVM即model,view,viewmodel,它是数据驱动模式,即所有的一切通过操作数据来进行,而尽量避免操作dom树。
当变量发生改变的同时, Vue 能在第一时间知道,并且对视图做出相应的改变操作。而这把钥匙就是 Object.defineProperty 。
vuex解决了vue项目中的数据状态管理问题 是组件通信的一种方式。原理:创建了单一的状态树,包含state,mutation,action,getter,module。
IE8不支持Object.defineProperty, 所以在使用了此方法的vue版本中, vue项目不能在IE8上运行 返回所有的自身可枚举属性组成的数组。
网站搭建框架之vue Vue是web前端快速搭建网站的框架之一。它与jQuery有所不同,是以数据驱动web界面(以操作数据改变页面,而jQuery是以操作节点来改变页面),同时,vue还实现了数据的双向绑定,可及时响应用户的输入。
VueRouter的基本使用
1、用 Vue.js + VueRouter 创建单页应用,是非常简单的。
2、Vue -router 是为了配合Vue.js 构建单页面应用而存在的,在使用方面,我们需要做的是,将组件映射到路由,然后告诉Vue-router 在哪里渲染它们。
3、其会在 根Vue 上注册2个全局 函数式组件 router-link router-view,在根Vue原型上 定义$route(当前路由Route对象)和$router(传入newVue的router对象列表)两个属性(所有子Vue实例会继承)。
4、两步完成用name传值并显示在模板里:在路由文件src/router/index.js里配置name属性。