1. 完成静态组件
2. 获取数据（created），动态渲染页面
3. 初始化:class={active:isActive === 1} 用排他,遍历数据,让数据的isActive全部等于0，操作isActive=1，实现功能

4. 用计算属性计算出一个新的满足条件（isActive = 1）的值, 用find

   1. this.addressInfo.find(item=>isActive==1)||{}

      支付模块

5. 引入静态组件，配置相应的路由

6. 跳转到支付组件时，要发起提交订单请求，提交成功服务器会返回一个订单号（存储在data中）
7. 通过query路由传参把订单号带给支付组件
8. 发请订单信息请求，拿到数据，动态渲染页面

9. 点击立即支付，通过elementui，弹出有支付二维码的遮罩层

   微信支付业务

10. 引入 qrcode库 生成二维码

11. 发请求获取支付的状态， 需要用到定时器，否则请求只能发送一次 ```javascript data(){ return {timer:null}}

if(!this.timer){ this.timer = setInterval(()=>{ //发请求 let res = xxxx if(res.code===200){ //支付成功,清除定时器，隐藏遮罩层 clearInterval(this.timer) this.timer = null //保存code状态码 防止用户没支付，点击支付成功，需要用code来判断 this.code = res.code //路由跳转 支付成功组件 this.$router.push(“xxx”) } }) }

```