# vue-app

**Repository Path**: pachverb/vue-app

## Basic Information

- **Project Name**: vue-app
- **Description**: No description available
- **Primary Language**: CSS
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-09-08
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 这是使用vue-cli构建的牛逼的项目

## Project setup
```
npm install
```

### Compiles and hot-reloads for development
```
npm run serve
```

### Compiles and minifies for production
```
npm run build
```

### Run your tests
```
npm run test
```

### Lints and fixes files
```
npm run lint
```

### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).

###移除严格模式（这里实在引用mui框架时候，因严格模式遇到的问题）

 **安装插件

npm install babel-plugin-transform-remove-strict-mode -D

 **配置babel
 
 **初始化组件
### 覆盖组件属性，需要去除scoped

### url地址能否传参需要后端设置，前端不能自行传入参数
 
**编程式导航，即使通过时间绑定，在组件定义方法，通过$router参数对象，来改变路由；取带之前使用的申明式导航，router-link
  $router 指向参数对象，$router 访问路由实例；$route 指向路由对象，一般用于
 ## 组件得抽离，这里对轮播组件得抽离.
 ##抽离轮播组件步骤
 ### 1.创建轮播组件
 ### 2.在父组件中挂在并调用该组件
 ### 3.子组件需要用到的数据，通过v-bind,传递到子组件.注意传递的数据，需要在子组件内props中定义在调用
-
# 添加购物车动画小球
###这里使用javascript钩子
###1.这里使用尝试使用Velocity.js
###2.标记写入钩子
###3.定义css样式

 **这里出现bug:不同分辨率或者滚动条切换都会导致小球目标位置的改变。解决办法：小球的位置设置动态，通过getboundingclientreact方法

#添加商品数量，并传给商品详情页面
###思路：通过时间绑定机制，子组件传值给父组件


#vuex
##组件的公共状态管理库。
 ![Alt](https://avatar.csdn.net/7/7/B/1_ralf_hx163com.jpg)
##本地存储中商品数量数据如何同步到子组件中
##购物车中数据渲染到，购物车组件页面中。问题来了，如何同步最新数到组件内
`循环car中数据，拿出id,和数量count,组成新对象。通过vuex的getters属性，对数据进行包装处理。最终将返回的对象，通过传值到子组件，渲染出来。
`
#商品选中提交最新结果到本地存储库

#css
`align-item 设置弹性盒子flex布局，子元素。在其容器中布局；`


#项目完成