vuex入门第一天之读取$store文件里面数据

原创于 2021-09-18 15:24:29 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

本文介绍如何使用Vuex进行状态管理，包括配置store文件夹及index.js文件，定义state存储数据，并在home.vue组件中通过计算属性获取state中的数据。

新建一个store文件夹，里面有index.js

//在store(仓库)下的index.js这份文件，就是用来做状态管理
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  //state相当于组件中的data，专门用来存放
  state:{
    num:0
  }
})

//state相当于组件中的data，专门用来存放

在home.vue中读取

{{$store.state.num}}

有些num写在computed

  computed: {
    num () {
      return this.$store.state.num
    }
  }

在home.vue中读取

{{num}}