vue3在setup中使用vuex相关方法

setup没有this

我们知道vue3的setup函数中是没有this的,就算传了context参数,打印出来也没有相关属性

useStore

这里我们可以直接从vuex 4.X中解构出useStore方法,就可以在setup中使用vuex的相关函数了,例子如下

<template>
  <div>
    <h2>{{ $store.state.count }}h2>
    <button @click="plusCount">点击button>
  div>
template>

<script>
import { useStore } from "vuex";

export default {
  setup(props, context) {
    const store = useStore(); // 使用useStore方法
    console.log(store);

    function plusCount() {
      store.commit("increaseCount");
    }
    return { plusCount };
  },
};
script>

你可能感兴趣的:(日常学习,vue.js,前端)