Vue app适配
media query (媒体查询) 的作用
- 可以检测 viewport(视窗) 的宽度与高度
- 可以检测设备的宽度与高度
- 可以检测设备的分辨率
- 检测到以上的数据后可以根据不同的设备的或者不同的屏幕高宽对网页内容做不同的样式
rem
- 1、什么是 rem
- rem 就是根据网页根元素「html」来设置字体大小,这有什么用呢？这是移动 webapp 的最佳的适配方案「目前来说」，因为其他的适配方案都有一些缺点
- viewport缩放「被废弃了」
- 宽度固定两边留白「体验很差」
- 响应式布局「工作量太大，针对不同的分辨率写一套 android 下估计开发者就疯了」
- rem 其实 很简单， 看右边这个代码
html{font-size: 16px}
- 就是给html根标签设定一个标准大小
16px，然后其他div 盒子的宽度高度啊都是 10rem这样，也就是说，我们页面的所有div盒子布局都跟这个根标签html有关，
- 所以当我们的设备（手机，平板，电脑）等分辨率改变的时候，我们只需要通过媒体查询或者JS代码来改变根标签的大小就可以了。
get 和 post 有什么区别
- GET在浏览器回退时是无害的，而POST会再次提交请求。
- GET产生的URL地址可以被Bookmark，而POST不可以。
- GET请求会被浏览器主动cache，而POST不会，除非手动设置。
- GET请求只能进行url编码，而POST支持多种编码方式。
- GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。
- GET请求在URL中传送的参数是有长度限制的，而POST么有。
- 对参数的数据类型，GET只接受ASCII字符，而POST没有限制。
- GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。
- GET参数通过URL传递，POST放在Request body中。
- 还有一个重要的就是 get 发出一次请求， post 发出两次请求，第一次发生通信，返回来的状态码是 100,确认目标可以通信，然后再把数据/参数放到 body中 post 出去
计算属性和监听器有什么区别
<!-- 复杂运算 -->
<div>{{message.split('').reverse().join('')}}</div>
<!-- 计算属性代替复杂运算 -->
<div>{{reverseMessage}}</div>
computed: {
<!-- 计算属性的getter -->
reverseMessage: function () {
return this.message.split('').reverse().join('');
}
}
Computed 与 Methods
- Computed 具有缓存，只有当里面计算的属性发生改变的时候才会去重新计算，而 Methods 则每次渲染都会重新计算
Watch 与 Computed
- watch是观察某一个属性的变化，重新计算属性值。简单的说，watch 有监视的感觉，就是我监视这个属性，他变化了，我要怎么怎么做，而 computed 更多的是针对这个值怎么变化，他就重新computed （计算）一次
- computed是通过所依赖的属性的变化重新计算属性值。
- 大部分情况下watch和computed几乎没有差别。但如果要在数据变化的同时进行异步操作或者是比较大的开销，那么watch为最佳选择。
Vue 中使用 v-for 渲染模板的时候， :key={item.id} 中的key有什么用?
- 看图，没有key的话，当用户选择了比如第二个按钮，然后这时候插入一个新的选项的话，渲染模板会自动添加然后默认第二个选中，而第二个选中的就不是“夜华”了，
- key 可以认为是一个唯一标识，在v-for 循环渲染的过程中给其中的每一个数据一个标识，所以当我们选中了某一个数据之后，如果数据列表发生改变，重新渲染后的vue 渲染模块可以记住那个被选中的key，再次选中。
- 而当多个数据中其中几个的数据发生改变的话，渲染模板只需要记住发生改变的值得key，然后再重新计算渲染只改变后的key的值就行了
