代码之家  ›  专栏  ›  技术社区  ›  Murasaki Aikon

将数据存储在虚拟用户.js带vue路由器

  •  0
  • Murasaki Aikon  · 技术社区  · 6 年前

    我有一个虚拟用户.js安装vue路由器以控制“页面”和axios以调用API的项目。

    这是我的路线

    routes: [
      {
        path: '/',
        name: 'LandingPage',
        component: LandingPage
      },
      {
        path: '/test',
        name: 'test',
        component: testing
      }
    ]
    

    <template>
      <div>
        {{title}}
      </div>
    </template>
    <script>
     import axios from 'axios'
    
     export default {
       name: 'app',
       data: function () {
         return {
           result: [],
           title:""
         }
       },
       methods: {
         fetchResult: function () {
           axios.get('https://jsonplaceholder.typicode.com/todos/1').then((response) => {
             this.result = response;
             this.title = response.data.title
             console.log(response);
           }, (error) => {
             console.log(error)
           })
         }
       },
       mounted: function () {
         this.fetchResult()
       }
     }
    </script>
    

    但当这里出现问题时,每次使用点击链接并重定向到此“页面”时,都会调用api。API每月只更新1-2次。

    我可以只调用一次,然后存储结果并使其在使用刷新页面或在新浏览器/选项卡中打开页面之前不会再次调用API吗?

    1 回复  |  直到 6 年前
        1
  •  0
  •   Jae Woo Woo    6 年前

    使用vuex怎么样?在挂载主应用程序时(只挂载一次),您可以在vuex存储中存储数据。

    另外,如果你想保持你的状态在多个标签,我建议你使用 localStorage

    看看这个: Multiple Tab LocalStorage single user Use case

    https://www.npmjs.com/package/vuex-localstorage