vue中v-model、v-bind、$root、axios的说明和深入理解
vue中最显著的特点就是响应式和数据的绑定
v-model会进行创建双向绑定进行更新和渲染,但是v-model本质上就是一个语法糖
对于双向绑定也就是说是mvvm数据的双向绑定:数据变化更新视图,视图变化更新数据;当然在vue中你需要双向绑定时对数据进行初始化的操作;说一下mvvm也就是model层到view层,view层到model层;数据进行同步变化
当然说的详细一点就是说v-model的绑定就是触发事件然后回填
就是通过$emit去进行回调
当然绑定的时候也会出现一点小问题;当出现勾选框的时候需要进行特殊的操作
比如绑定上checked;具体操作需要看业务的逻辑
v-bind 是单项绑定就是说将model层的数据绑定到view层,当然说的直白一点就是在model层进行操作视图层就会进行联动更新
当然它和双向绑定一样在使用绑定时必须要在prop中进行初始化声明
当然只能从model层往视图层出发,用来渲染视图层
$root、$parent、$refs
$root和$parent都是访问父组件的实例和方法
区别在于$parent访问的是它最近一级的父组件;通过$root可以访问得到根父组件
$refs
这个是在子组件标签定义ref属性,在父组件中可以通过$refs访问子组件实例;这个例子就是elemenui中form表单验证的使用
说完这个咱们再说说$router和$route
router是vueRouter的实例,使用router.push方法,路由跳转,传递参数等。可以认为是全局的路由对象,包含了所有路由的对象和属性
返回上一个历史history用$router.to(-1)
$route为当前router跳转对象。里面可以获取当前路由的name,path,query,parmas等 可以拿里边的值来做各种判断。
axios是一个基于promise用于浏览器和nodejs的HTTP客户端
1、从浏览器中创建XMLHTTPRequest
2、从nodejs发出http请求
3、支持promise Api
4、拦截请求和响应
5、转换请求和响应数据
6、自动转换JSON数据
vue中使用axios
第一步安装axios:npm install axios
第二步在mainjs文件中引入axios:import Axios from 'axios'
第三步将axios全局挂在到vue原型上
上述是通过我自己改写的,还有很多改写的方法