
**城市选择与搜索区域**
均为fixed布局时
```
position: fixed;
z-index: 999;
top: 0;
left: 0;
```
**better-scroll滚动部分**
```
<div class="wrapper" ref="wrapper" v-show="keyword">
<ul class="result">
<li v-for="(item,index) of this.result" :key="index">{{item.name}}</li>
</ul>
</div>
```
```
.wrapper {
width: 100%;
height: 565px;
//调整高度使得所有内容都可以现实出来!!!很重要!!!
overflow: hidden;
//超过隐藏使得该滑块不至于滑到顶部蓝色搜索区域
```

```
position: fixed;
top: 103px;
left: 0;
z-index: 999;
background: #fff;
.result {
line-height: 30px;
li {
padding-left: 10px;
border-bottom: 1px solid #eee;
}
}
}
```
- vs code 所需插件
- 新建项目基础配置
- 新项目初始化
- 项目打包上传
- 适配
- vue-vw
- vue-rem
- 基础
- 跳转
- 循环
- 样式
- 组件
- 子组件自定义事件向父组件传参
- 兄弟组件之间传参(含vuex)
- 实例:实现子组件word、list之间的参数传递
- 父子组件
- vuex的使用
- 精简版(不经过action)
- 组件实例(axios+http)
- axios读取网络数据
- MovieItem组件
- swiper
- better-scroll
- position:fixed搭配使用
- 数据绑定
- 计算属性
- 计算属性(computed)与监听属性(watch)搭配使用
- 侦听
- 动画
- 原理
- 使用iconfont
- 雪碧图
- 插槽
- @import引入外部样式
- 路径配置
- ref属性
- 显示隐藏的控制
- 生命周期
- 数据请求
- vuex
- 小效果
- 1.下滑顶部标题显示
- 2.在页面初始时加入动画效果
- 小项目
- Vue搜索功能
- Vue电影数据获取渲染
- Vue-travel
- main.js
- HTTP.js
- Head.vue
- swiper.js
- Home.vue
- 小技巧
- 1.阻止双击页面图片放大
- 2.缓存设置
- 3.跳转页面后从顶部开始显示
- 4.打包
- 5.使用store.js中的数据
- 使用库
- vant
- vant-list
- weex(实现vue代码编写Android软件)
- 1.启动项目
- 2.搭配Android studio
- vuex
- 1.State
- 2.Getter
- 3.Mutation
- 注
- 使用echarts
- echarts更换主题
