Nuxt如何将服务测数据存储到Vuex中

简介: Nuxt如何将服务测数据存储到Vuex中

theme: channing-cyan

Nuxt中有个nuxtServerInit方法。

Nuxt 调用它的时候会将页面的context上下文对象作为第2个参数传给它(服务端调用),与fetch一样,不包括context.redirect和context.error方法,当我们想要将服务端的一些数据传到客户端,可以通过这个获取保存在状态中,客户端再从状态里取。

const actions = {
   
   
  nuxtServerInit({
   
    commit}, {
   
   req}) {
   
   
    console.log('req.session', req.session)
  }
}

注:必须配置在Vuex中的index配置。

目录
相关文章
|
6月前
|
存储 资源调度 JavaScript
在Vue 3项目中引入Pinia进行状态管理并持久化存储
在Vue 3项目中引入Pinia进行状态管理并持久化存储
117 0
|
6月前
|
存储 JavaScript
vue项目中数据存储(pinia)
vue项目中数据存储(pinia)
102 0
|
8月前
|
存储 JavaScript
Vue2向Vue3过度核心技术组件通信2
Vue2向Vue3过度核心技术组件通信2
46 0
|
17天前
|
JavaScript 前端开发 开发者
Vue的单文件组件:.vue文件的结构和优势
【4月更文挑战第24天】Vue的单文件组件(.vue)整合模板、脚本和样式,简化开发。包含模板(定义UI界面)、脚本(处理逻辑)、样式(局部样式)三部分。优势在于:组件化开发提高代码复用性;局部样式避免冲突;文件结构清晰易于管理;且有丰富工具支持,提升开发效率和代码质量。
|
2月前
|
JavaScript
在vue中,怎样理解 Vue 的单向数据流?
在vue中,怎样理解 Vue 的单向数据流?
24 5
|
4月前
|
JavaScript
深入理解 Vue.js 中的`mapState`辅助函数:简化状态管理的秘密武器(上)
深入理解 Vue.js 中的`mapState`辅助函数:简化状态管理的秘密武器(上)
|
4月前
|
JavaScript
Vue中的组件通信方式及应用场景
Vue中的组件通信方式及应用场景
28 0
|
9月前
|
存储 缓存 JavaScript
Vue 组件数据通信方案总结
Vue 组件数据通信方案总结
40 0
|
7月前
|
存储 JavaScript 前端开发
Vue组件通信原理及应用场景解析
Vue组件通信原理及应用场景解析
106 1
|
8月前
|
前端开发 开发者
Vue2向Vue3过度核心技术组件通信1
Vue2向Vue3过度核心技术组件通信1
55 0
Vue2向Vue3过度核心技术组件通信1