nuxt如何在其它js文件中使用store

去除 nuxt.js 框架下的 window.__NUXT__ 问题描述: nuxt.js 框架建设网站,在网站页面点击查看 查看网页源代码,就会发现源代码里面有一串这样的代码window.__NUXT__=(function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,_,$,aa, ........ 阅读详情

前言

在新建的js文件中想用store里面的数据,比如token想在封装的axios里面,请求头里面去使用,亦或者通过app的JS接口获取token并存储在store里面。我们都知道如何在vue中如何使用。

代码

/*
 * @Description: 
 * @Author: lxc
 * @Date: 2019-07-02 16:14:07
 * @LastEditTime: 2019-08-14 16:08:19
 * @LastEditors: lxc
 */
// 导出 store 的地方

import Vue from 'vue'
import Vuex from 'vuex'
import state from './state'
import actions from './actions'
import mutations from './mutations'
import getters from './getters'
import canteen from './modules/canteen'
import contact from './modules/contact'
import health from './modules/health'
import scan from './modules/scan'

Vue.use(Vuex)

let store

const initStore = () => {
  return store || (store = new Vuex.Store({
    // 存放公用数据
    state,
    // 异步操作要通过actions,否则通过cimmit直接操作mutations
    actions,
    // 同步放数据
    mutations,
    getters,
    modules: {
      // store 模块....
    }
  }))
}

export default initStore

其它js文件中如何调用:

import store from '@/store'

const TOKEN = 'testToken'

//  这里只是举个例子
function getToken() {
  return isNotEmpty(store().state.token) ? store().state.token : TOKEN
}

我自己使用是可以的。希望对大家有帮助。

nuxt 实现在其它js文件中使用store的方式 前言 在新建的js文件中想用store里面的数据,比如token想在封装的axios里面,请求头里面去使用,亦或者通过app的JS接口获取token并存储在store里面。 我们都知道如何在vue中如何使用。 代码 /* * @Description: * @Author: lxc * @Date: 2019-07-02 16:14:07 * @LastEditTime: 2019-08-14 16:08:19 * @LastEditors: lxc */ // 导出 store 的地方 import Vue from 'vue' import Vuex from 'vuex' 立即下载

相关推荐

银河麒麟桌面版V10搭建Qt4.8.6开发环境

银河麒麟桌面版V10搭建Qt4.8.6开发环境

qq_34932364的博客 2400

nuxt:如何在nuxt项目的js文件里获取当前应用的store或者router?

如何在nuxt项目的js文件里获取当前应用的store或者router?

m0_64401231的博客 2325

STM32+ESP8266接入OneNet的MQTT嵌入式实现

MQTT是一种轻量级发布/订阅模式的消息传输协议,广泛应用于资源受限的物联网终端设备通信。其基于TCP/IP栈构建,具备低带宽占用、小代码体积和高可靠性等技术优势,特别适合STM32等MCU与Wi-Fi模组协同工作的边缘节点场景。在实际工程中,需结合AT指令集控制ESP8266完成Wi-Fi连接、TCP建链及MQTT会话管理,并通过环形缓冲区、空闲中断检测等机制保障UART异步通信稳定性。本文围绕STM32F103与ESP8266硬件协同、OneNet平台对接、JSON消息解析与OLED状态反馈等关键环节,

yhn456789的博客 1037

【在js文件中使用vuex,store】

在js文件中使用vuex,store

weixin_45310430的博客 2191

2024年中科大分子生物研究生考试建议

分子生物学复习资料及往年考题。

qq_43337249的博客 2953

基于Simulink的电力电子负载特性模拟仿真实例

电阻性负载是最简单的负载形式,其阻抗为纯电阻,电流和电压之间的关系符合欧姆定律。电阻性负载的特点是消耗能量,不会存储能量。本示例将以一个典型的直流电源供电系统为例,展示如何利用Simulink进行不同负载特性的仿真模拟。直流电源:提供固定电压输入。逆变器(可选):根据需要产生PWM调制信号,驱动负载。负载模块:模拟不同类型的负载特性,如电阻性负载、电感性负载和容性负载。测量模块:用于观察负载上的电压和电流波形。系统架构视图plaintext深色版本v| || |

xiaoheshang_123的博客 429

vue3在js文件中使用store

vue3在js文件使用store报错undefined

qq_40787608的博客 3139

将 SAP BTP ABAP environment 与 SAP S/4HANA Cloud 公有云版集成:从架构理念到落地实战

本文探讨了在SAP云环境中实现ABAP扩展应用与S/4HANA Cloud系统集成的技术方案。通过建立标准化的远程通信通道,开发者可在SAP BTP ABAP环境中开发扩展应用,同时安全访问S/4HANA Cloud的核心业务数据和服务。文章详细介绍了整体架构设计、开发实现步骤(包括定义通信场景、生成服务消费模型和编写调用代码)以及管理员在S/4HANA侧的配置工作(创建通信安排和技术用户)。通过一个业务伙伴自助注册平台的案例,展示了如何在不修改标准系统的情况下实现云扩展,体现了SAP"干净核心&

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 239

nuxt项目在js文件中使用api 和store

【代码】nuxt项目在js文件中使用api 和store。

renlihui8617的博客 537

2026年数学建模国赛论文排版规范:Word与LaTeX终极对比及模板

提前演练:不要等到比赛开始才第一次使用排版工具。至少在赛前一个月完成1-2篇模拟论文的全流程排版练习。建立检查清单:基于国赛规范制定排版检查清单,在提交前逐项核对——公式编号连续?图表引用准确?参考文献完整?页数不超限?善用模板但不止于模板:模板提供的是起点而非终点。根据自身需求调整宏包配置和样式参数,理解每一行配置的含义。关注评审体验:从评委的视角审视论文——重点内容是否突出?逻辑结构是否清晰?视觉层次是否合理?备份与容错:无论使用何种工具,建立多级备份机制。本地、云端、U盘各存一份,且定期保存历史版本。

YOLO 210

YOLO11 改进 - C2PSA | C2PSA融合HEWL(高频增强小波层):小波逆变换+双通道注意力增强+高频显式增强 | TGRS 2026

本文介绍了高频增强小波层(HEWL),一种专为解决红外小目标检测中边缘退化与语义模糊问题设计的上采样模块。该方法结合小波逆变换与交替通道注意力(ALCA),通过显式增强高频细节并优化特征融合,实现精准的边缘重建与语义对齐。我们将 HEWL 融入 PSABlock 结构构建了 C2PSA_HEWL 模块,并成功集成进 YOLO11 的骨干网络,替代原有的 C2PSA 模块。实验证明,结合 HEWL 的 YOLO11 在检测任务中表现优异,有效提升了模型对细节特征的捕捉能力。

魔改工程师的博客 103

nuxt 如何引入js_nuxtjs如何在单独的js文件中引入store和router

nuxtjs里面集成vuex的创建方式改变了,并且官方不建议以导出Vuex实例的方式创建store,并且会在nuxt3里面删除。这样就会存在一个问题,我怎么像普通vue spa项目一样直接 import store from '@/store'呢?虽然官方建议为这个js写一个plugins,然后在 plugins 里面使用export default ({ app, $axios, store, ...

weixin_39972567的博客 536

【AMD | Docker】超级全面版本:在Docker中验证AMD GPU移动显卡可用性的方法

1. 安装ROCm Docker支持 ■AMD GPU驱动 ■ROCM ■Docker 2. 配置Docker使用ROCm 3. 使用官方ROCm Docker镜像 4. 使用Docker CLI参数访问GPU

静谧、淡雅 684

Nuxt.js项目中js文件单独使用Vuex的store

Nuxt.js 项目中使用Vuex和Vue项目中使用略有不同 如果需要再单独的js文件中使用store,需要使用经典模式,不过文档介绍说 此功能已经弃用,将在Nuxt 3中删除。 总之Nuxt.js坑还是很多的,因为一套代码涉及服务器端执行和浏览器端执行,不是很好区分执行代码 实践下来发现还是坑比较多,虽然可以复用Vue的组件模块,不过小型项目还是使用传统的PHP会好一些 修改 store/index.js import Vuex from "vuex"; const store = new Vuex.

彭世瑜的博客 4488

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

STM32F407中文手册

STM32f407中文手册 本参考手册面向应用开发人员,提供有关使用 STM32F405xx/07xx、STM32F415xx/17xx、 STM32F42xxx 和 STM32F43xxx 微控制器存储器与外设的完整信息。STM32F405xx/07xx、STM32F415xx/17xx、STM32F42xxx 和 STM32F43xxx 构成一个微 控制器系列,各产品具有不同的存储器大小、封装和外设。有关订购信息以及器件的机械与电气特性,请参见数据手册。有关 ARM Cortex™-M4F 内核的信息,请参见《Cortex™-M4F 技术参考手册》。

vue 在js 文件中使用store_nuxt 实现在其它js文件中使用store的方式

前言在新建的js文件中想用store里面的数据,比如token想在封装的axios里面,请求头里面去使用,亦或者通过app的JS接口获取token并存储在store里面。我们都知道如何在vue中如何使用。代码/** @Description:* @Author: lxc* @Date: 2019-07-02 16:14:07* @LastEditTime: 2019-08-14 16:08:19*...

weixin_39959192的博客 727

RU DOS版、EFI版32bit/64bit BIOS常用工具

DOS版、EFI版的RU工具,可用来查看IO、MEM、PCI、SMBIOS等资源。亲测在EFI SHELL下可用。

nuxt引入js_nuxtjs如何在单独的js文件中引入store和router

nuxtjs里面集成vuex的创建方式改变了,并且官方不建议以导出Vuex实例的方式创建store,并且会在nuxt3里面删除。这样就会存在一个问题,我怎么像普通vue spa项目一样直接 import store from ‘@/store‘呢?虽然官方建议为这个js写一个plugins,然后在 plugins 里面使用export default ({ app, $axios, store, ...

weixin_39787826的博客 736

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

nuxt vue 常用变量 store文件夹下 index.js 自定义.js文件如何运用原理剖析

Nuxt是解决SEO的比较常用的解决方案,随着Nuxt也有很多坑,每当突破一个小技术点的时候,都有很大的成就感,在这段时间里着实让我痛并快乐着。在这里根据个人学习情况,所踩过的坑做了一个汇总和总结。 Nuxt开发跨域 项目可以使用Nginx来反向代理,将外来的请求(这里也注意下将Linux的防火墙放行相应端口)转发的内部Nuxt默认的3000端口上,最简单的配置文件如下: nuxtjs.config.js { modules: [ '@nuxtjs/axios', '@nu

qq_34246965的博客 2330

Nuxt.js国际化vue-i18n的搭配使用

Nuxt.js国际化的前提是,已经使用脚手架工具搭建好了Nuxt.js的开发环境。 我使用的环境是nuxt@2.3 + vuetify@1.4 + vue-i18n@7.3 1. 先安装vue-i18n npm install --save vue-i18n 2. 更新store文件 在@/store/index.js文件中,修改添加如下代码: export const state = () =&...

weixin_30576859的博客 929

Nuxt.js

Nuxt 目录 1.nuxt目录 项目编译后目录 相当于classes 2.Component 组件目录 3.layouts 布局目录 4.pages 所有页面目录 5.plugins 插件目录 6.static 静态资源目录,用于存放不需要编译js css 7.store vuex 目录 8.nuxt.config.js nuxt核心配置 9.package.json vue项目核心配置 nux...

恩琪 356

nuxt 目录结构及配置文件详解

nuxt 目录结构详解 首先我们来看下使用 create-nuxt-app脚手架工具所创建的nuxt项目目录的结构, windows cmd 命令行输入,tree /f /a ,打印如下项目目录结构: C:. | .editorconfig | .gitignore | nuxt.config.js | package.json | README.md | +---assets...

小青蛙的博客 7355

04-Nuxt.js基本使用-创建Nuxt工程

3 Nuxt.js基本使用 3.1 创建Nuxt工程 nuxt.js有标准的目录结构,官方提供了模板工程,可以模板工程快速创建nuxt项目。 模板工程地址:https://github.com/nuxt-community/starter-template/archive/master.zip 本项目提供基于Nuxt.js的封装工程,基于此封装工程开发搜索前端,见“资料”–》xc-ui-pc-portal.zip,解压 xc-ui-pc-portal.zip到本项目前端工程目录下。 本前端工程属于门户的一部

minihuabei的博客 325

Nuxt2项目搭建(Nuxt2+element+less详细步骤

记录学习nuxt项目搭建的步骤和坑提示:以下是本篇文章正文内容,下面案例可供参考使用起来跟vue差不多。如果你想自己写个小小的测试服务器,那么找个坑位初始化项目新建index . js文件夹 如下try {//一般这里是去请求数据库数据res.json({msg: '登录成功',code: 200,});} else {res.json({msg: '账号密码错误',code: 500,});res.statusCode(500).send('服务器错误');});

qq_43222625的博客 2893
上一篇: cube-ui form控件input增加金钱规则
下一篇: nuxt扫一扫功能
Zz_糖小七
博客等级 码龄10年 1732粉丝 42原创
评论 4
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值