javascript - vue 如何做到不销毁组件？

Question

我在首页（index.html）上加了router-view ,然后把几个页面分为几个组件（一个个.vue文件），然后全部引入一个main.js上，通过这个文件写路由加载组件，但是我不想路由每次跳转后，前面访问过的页面的数据都消失了，这样又要重新获取。。但是我在router-view标签上加了 keep-alive并没有用啊，还是有其他什么要配置的吗？或者说有什么其他方法，可以做到数据不销毁，有没有类似angular的service？

上面是目录结构

Answer 1

用vuex。页面数据保存在store的state里，store相当于全局变量，只要你浏览器不刷新，view之间的跳转是不会导致数据销毁的，除非你手动更新state中的数据。

Answer 2

vuex可，vue的话就把重要的变量保存在全局vUE上吧

Answer 3

可以选择使用奇技淫巧。
每次组件重新生成时使用的不是全新的对象字面量，而是对同一个对象的引用。
这个对象引用，可以用闭包变量_$v（或全局变量$v）来持存。

data:function(){return _$v;}

（或）

data:function(){return {v:_$v};}

例如：

<p>
    <v-v v-for="_ in s"></v-v>
    <input v-model="v.v">
    <button @click="++s">plus</button>
</p>
<script>
    (function(){
        var _$v={v:'v'};
        Vue.component('v-v',{
            template:'{{v}}<br>',
            data:function(){return _$v;}
        });
        new Vue({
            el:'p',
            data:{
                v:_$v,
                s:2
            }
        });
    })();
</script>

当然，这是开发Vue(x)思路，即利用原生JavaScript对象特性。
对于使用Vue(x)，最合理的似乎就是大家所说的Vuex，人家会自动化代理这些的。
不过这样循序渐进，仍然有助于更好地理解、学习、进入和软着陆使用Vuex。

Answer 4

1. 写一个value.js

   let value = {

      id : 0, 
      name : ''

   }
   export default value;

2. 在vue组件中使用

   import Value from './value'

   data : ()=>{

      return Value

   },

   组件销毁之后 数据还是在value中 下次进入时会自动读取

Answer 5

好了，基本都解决了.
1.数据的保存，参见上面的答案
2.安卓里，router-view出不来，原因：之前是绑定了html标签，就router.start（）里面绑定的标签，然后我换成一个p，可以了，不知道为什么！