在我的Vuejs项目中,我有一些常见的js函数,可以通过多个组件使用:

我的代码 struct 如下,它是在http://vuejs.github.io/vuex/en/structure.html年引入的:

├── index.html
├── main.js
├── components
│   ├── App.vue
│   └── ...
└── vuex
    ├── store.js     # exports the store (with initial state and mutations)
    └── actions.js   # exports all actions

some_component.vue

<template>
// The page content
</template>

<script>
export default {
    attached: function() {
        if(!isLoggedIn) {
            $this.router.go('/signin');
        }
    }
}
</script>

在本例中,我想创建一个函数loginRequired,它将在几个组件中调用.

那么我应该如何组织代码呢

推荐答案

这是我的 Select

├── index.html
└── src
    ├── main.js
    ├── config.js        # Here I define global constants like a base url for vue-resource
    ├── api              # here is all the http calls using Vue.resource
    │   ├── index.js
    │   └── resource.js  # here I define interceptors, for errors log, auth, etc
    ├── components
    │   ├── utils        # Here I define common functions for components
    │   ├── App.vue
    │   └── ...
    └── vuex
        ├── store.js     # exports the store (with initial state and mutations)
        └── actions.js   # exports all actions

所以,根据我的文件 struct ,你想要的应该在src/components/utils文件夹中,至少它使用了一些http调用,在这种情况下,它将是src/api api文件夹的一部分.在这种情况下,路由在main.js文件中,有些人更喜欢在src文件夹中有一个专用的routes.js文件,这取决于您

Vue.js相关问答推荐

在VueJS中卸载元素之前是否应该删除JavaScript事件收件箱?

VueI18n 无法读取或更改组合 API 中的区域设置

如何将外部 svg 转换为 Vue3 组件?

当用户在嵌套路由中时激活链接

Vue3 动态渲染

在 VueJS 中为 Get、Post、Patch 配置全局标头的最佳方法

使用 Vue.js 将文件输入绑定到按钮

vuejs vue-cli 如何使用 console.log 而不会出现任何错误

根据 URL 有条件地隐藏视图组件

如何将参数传递给使用 ...mapActions(...) 映射的函数?

SVG 加载 vue-svg-loader; [Vue 警告]:无效的组件定义

错误 [ERR_UNSUPPORTED_ESM_URL_SCHEME]:默认 ESM 加载器仅支持文件和数据 URL - Vue 3

基于条件的VueJS HTML元素类型

这是 v-on:change 的正确用法吗?

为 Vue 组件动态添加属性

将登录页面包含在单页应用程序中是否不安全?

如何从 Vuex 操作访问 Vuex 状态属性?

从 vuex 存储访问 $vuetify 实例属性

如果通过 jquery 更新,Vuejs 绑定不起作用

如何在 vue3 中的setup方法中发出事件?