2

我想使用Feathers-Vuex将Quasar与FeathersJS集成

Feathers-Vuex 使用一种模式来：

  • 承诺从 localStorage/cookies 进行身份验证
  • .then( /*启动new Vue()应用程序 */ )

我使用 Quasar CLI 1.0.beta16-ish 创建了我的应用程序，并查看了 /src 并找不到 Quasar 的主要入口点。我觉得我错过了什么。

包括src/store/index.js什么？

quasar.conf.js包括此评论 - 在哪里main.js

    // app boot file (/src/boot)
    // --> boot files are part of "main.js"
    boot: ["axios"],

Feathers-Vuex 包含一个可以解决相同问题的Nuxt集成指南。这些包对我来说都是新的，我很高兴学习它们！

谢谢！

4

2 回答 2

1

的部分main.js包含在您可以在.quasar文件夹中找到的 quasar app.js 中。包含Vuex src/store/index.jsStore 定义。“存储”基本上是一个保存应用程序状态的容器。

有关更多详细信息，请访问 - https://quasar-framework.org/guide/app-vuex-store.html https://quasar-framework.org/guide/app-plugins.html

于 2019-04-22T03:59:10.093 回答
0

我最终得到了两件事：

  1. 将 Feathers-Vuex 添加到我的后端。
  2. 在我的 Quasar 项目中添加这个“启动文件”

如果我不得不再次弄清楚，这些评论就像面包屑一样:-)

/*
  Context: 

  For 3rd-party API's, we us /src/boot/axios.js

  For our own API's, we use FeathersClient (socket.io & REST)
  https://docs.feathersjs.com/guides/basics/clients.html
  https://docs.feathersjs.com/api/authentication/client.html#appconfigureauthoptions

  Our FeathersClient is in `/src/lib/feathersClient.js`
  and imported into `/src/store/index.js`
  which is imported by Quasar's build system.  /src/quasar.conf.js setting(?)

  Feathers-vuex integrates Vuex with FeathersClient:
  https://feathers-vuex.feathers-plus.com/auth-module.html

  Feathers-Vuex proxies it's authentication/logout actions to FeathersClient
  https://github.com/feathers-plus/feathers-vuex/blob/master/src/auth-module/actions.js

  The parameters for these actions are here:
  https://docs.feathersjs.com/api/authentication/client.html#appauthenticateoptions

  In addition to this module, you can use FeathersVuex state in UI from here:
  https://feathers-vuex.feathers-plus.com/auth-module.html


  This module:

  Create a Feathers Auth integration for Vue as a Quasar Boot Module. 

  // Use case: test if user is authenticated

    if (Vue.$auth.currentUser()) { ... }

  // Use case: get current user's email

    name = Vue.$auth.currentUser("email") || "anonymous"

  // Use case: Login

    Vue.$auth.login({
      strategy: 'local',
      email: 'my@email.com',
      password: 'my-password'
    });

  // Use case: Logout

    // logs out and sends message
    let p = Vue.$auth.logout();
    // After logout, go home
    p.then(() => {
      // User data still in browser
      router.push({ name: "home"});
      // To clear user data, do a hard refresh/redirect - https://feathers-vuex.feathers-plus.com/common-patterns.html#clearing-data-upon-user-logout
      location && location.reload(true)
    }); 

 */

export default ({ app, router, store, Vue }) => {
  // Create the API demonstrated above
  const auth = {
    currentUser(prop) {
      let u = store.state.auth.user || false;
      if (u && prop) return u[prop];
      return u;
    },
    login(authData, quiet) {
      return store
        .dispatch("auth/authenticate", authData)
        .then(() => {
          Vue.prototype.$q.notify({
            message: "Welcome back!",
            type: "info"
          });
        })
        .catch(err => {
          if (!quiet) {
            console.log(err);
            Vue.prototype.$q.notify({
              message: "There was a problem logging you in.",
              type: "error"
            });
          }
        });
    },
    logout(quiet) {
      return store.dispatch("auth/logout").then(() => {
        if (!quiet)
          Vue.prototype.$q.notify({
            message: "You've been logged out.",
            type: "info"
          });
      });
    },
    register(authData) {}
  };

  // Auth from JWT stored in browser before loading the app.  true => suppress token not found error
  auth.login("jwt", true);

  // Add API to Vue
  Vue.prototype.$auth = auth;

  // If you would like to play with it in the console, uncomment this line:
  // console.log(auth);

  // Then, in the console:
  /*
    temp1.login({
      strategy: "local",
      email: "feathers@example.com", 
      password: "secret" 
    })
  */

  // If you haven't created this user, see here:
  // https://docs.feathersjs.com/guides/chat/authentication.html
  // For this REST api endpoint
  /*
    curl 'http://localhost:3001/users/' -H 'Content-Type: application/json' --data-binary '{ "email": "feathers@example.com", "password": "secret" }'
  */
};
于 2019-04-22T04:05:34.493 回答