show-close

@@ -31,6 +31,6 @@
     </div>
 </div>
 
-<div id="app">
-    <app></app>
+<div id="vAddressAct">
+    <vue-address-act></vue-address-act>
 </div>

@@ -22,6 +22,16 @@ var $addressForm = $('.edit-address'),
     currentPage = 'edit',
     newArea = [];
 
+var Vue = require('vue');
+var vueAddressAct = require('home/address/address-act.vue');
+
+var addressVact = new Vue({
+    el: '#vAddressAct',
+    components: {
+        vueAddressAct: vueAddressAct
+    }
+});
+
 require('../common.js');
 
 $($editAddressPage, $addressListPage).css('min-height', function() {
@@ -81,7 +91,7 @@ $addressForm.on('submit', function() {
     isSubmiting = true;
     loading.showLoadingMask();
     $submit.css('background', '#777');
-    console.log(window.queryString.refer);
+
     $.ajax({
         method: 'POST',
         url: '/home/saveAddress',
@@ -132,10 +142,7 @@ function bindAddressListEvent(html) {
 
     // 省市区
     $area.on('touchend', function() {
-        $editAddressPage.hide();
-        $addressListPage.show();
-        currentPage = 'list';
-        $navTitle.html('地区选择');
+        addressVact.$children[0].show = true;
     });
 
     // touchend 在下滑的时候会触发
@@ -191,16 +198,7 @@ function bindAddressListEvent(html) {
     });
 }
 
-// 读取省市区列表缓存
-// if (window.localStorage && window.localStorage.getItem) {
-//     chinaAddressList = window.localStorage.getItem('chinaAddressList');
-// }
-
-// if (chinaAddressList) {
-//     bindAddressListEvent(chinaAddressList);
-// } else {
-
-    // 省市区列表异步加载
+// 省市区列表异步加载
 $.ajax({
     method: 'GET',
     url: '/home/locationList',
@@ -208,22 +206,6 @@ $.ajax({
     cache: true
 }).then(function(html) {
     bindAddressListEvent(html);
-
-        // if (window.localStorage && window.localStorage.setItem) {
-        //     window.localStorage.setItem('chinaAddressList', html);
-        // }
 }).fail(function() {
     tip.show('获取省市区列表失败');
 });
-
-// }
-var Vue = require('vue');
-
-var app = require('home/address/address-act.vue');
-
-new Vue({
-    el: '#app',
-    components: {
-        app: app
-    }
-});

 <template>
-    <div class="address-select-component">
+    <div class="address-select-component" v-show="show">
         <div class="address-select-box">
-            <div class="component-title"><span class="title">所在地区</span><span class="iconfont close">X</span></div>
+            <div class="component-title"><span class="title">所在地区</span><span class="iconfont close" @click="closeAddBox">X</span></div>
             <ul class="head-address-ul">
                 <li class="head-address-li">请选择</li>
                 <li></li>
@@ -135,22 +135,22 @@
 </style>
 <script>
     require('../../../scss/home/_address.css');
-    let headerComponent = require('common/header.vue');
 
     module.exports = {
         data() {
             return {
-                addresses:[]
+                addresses:[],
+                show: false
             };
         },
-        components: {
-            headerComponent
-        },
         methods: {
             selectProvince() {
                 $.get('/home/getaddress.json', resultData => {
                     this.addresses = resultData;
                 });
+            },
+            closeAddBox() {
+                this.show = false;
             }
         },
         created: function() {