Flex:2 = flex-grow: 2 flex-shrink: 1 flex-basis: 0%
Flex:auto = flex-basis:auto跟flex:1效果是一样的, 1 1 auto
Flex:none那每个项目保持不变,还是占据没有使用flex的空间 0 0 auto
如果每个项目都加了flex:1,项目等分空间
如果只有1个项目加了flex:1(flex:2, flex:3…),那么其余项目占据空间不变,此项目占据剩余所有空间
Flex-driction项目排列方向
flex-wrap 项目换行方式
Flex-flow:row nowrap
含义和用法
mapGetters :
Cumputed计算方法里用的
mapActions:
methods方法里用的
Map
action里使用commit方法触发mutations里改变state的方法
getters获取state状态
Vuex 数据更新流程:
通过 mapAction 异步提交事件到 action,action 通过 commit 提交到 mutation,然后 mutation会修改 state 中的值,getters 获取state 状态,然后页面中引入 getters 获取更新状态
Mutation 必须是同步的,如果需要异步就要使用 action
action 中使用 this. s t o r e . c o m m i t 进 行 同 步 修 改 , 使 用 t h i s . store.commit 进行同步修改,使用 this. store.commit进行同步修改,使用this.store.dispatch 进行异步修改
mutation 与 action 区别:
Mutation 第一个参数是 state,是改变状态,里边是同步操作。action 是提交mutation,里边可以异步操作
调用 mutation :
1.引入 mapMutations函数,
methods:{
…mapMutations([‘add’,‘addN’]);
}
this.add()
2.触发 action
-
new Vue,执行初始化
-
挂载$mount方法,通过自定义Render方法、template、el等生成Render函数
-
通过Watcher监听数据的变化
-
当数据发生变化时,Render函数执行生成VNode对象
-
通过patch方法,对比新旧VNode对象,通过DOM Diff算法,添加、修改、删除真正的DOM元素
前端路由分为两种模式,分别是hash模式和history模式
hash模式
原理实现是通过监听hashchange的改变进行无刷新渲染
history模式
原理通过调用history.pushState(无刷新插入历史状态,更新url)更新url,并且监听popstate回退键事件进行渲染
先比较dom树,如果有组件不存在了直接销毁;然后比较组件,最后比较element节点,返回一个patch节点包含两个虚拟dom的差异进行渲染
1.写法不一样
2.箭头函数都没有名字
3.this指向不一样,普通 函数作用域为调用它的对象,箭头函数为当前上下文(如声明在全局那么this的作用域即为上下文)
4.箭头函数不能使用New 实例化
1.没有循环等复杂结构的都是O(1)
2.有一层循环,算法的性能会随着输入数据的大小变化而线性变化的是O(n)
3.有多层循环,算法性能随着数据呈现数次增长,算法性能为O(n2)、O(n3)、O(n^4)
204 无内容,服务器成功处理但未返回内容
205 重置内容,提醒用户刷新
301 页面永久重定向
302页面临时重定向
303 查看其他地址,使用 get post
304该资源未更新
400客户端请求语法错误
404找不到服务器
500服务器内部错误
分为强制缓存和协商缓存,浏览器读取缓存过程为内存-硬盘-服务器缓存
1.强制缓存:Cache-control和expries
Expries 是对比客户端和服务器时间差异,比较缓存是否过期,值为一个时间绝对值
Cache-control相对时间,如300S
2.协商缓存
强制缓存失效后,浏览器携带缓存标识请求服务器,由服务器缓存标识决定是否使用缓存
Last-modified/If-modified-since上次请求返回的最后被修改时间,检查服务器资源是否被更新
Etag/If-node-since返回校验码,etag 保证每个资源都是唯一的
React 适用于大型工程、多人协作工作,和 ts 配合更好
Vue 本身不依赖webpack,但 vue-cli 里边的webpack环境 依赖 node 开发出来的,webpack 是依赖 node 的
移动端跨平台使用 react native
单例模式
工厂模式
发布订阅模式
Diff 异步加载
1.Lodash debounce throttle 限制函数在一定时间内的调用次数
2.想要页面在第一次加载时请求,之后使用节流,点击按钮的时候获取当前时间戳,距离当前时间戳 XX 秒后调用节流函数