vue3setup组合式store文件夹下的module文件夹下的teacher.js的state怎么才能使用
时间: 2024-03-01 20:51:40 浏览: 64
要在Vue 3中使用`setup`和组合式API访问`store`中`module`文件夹下的`teacher.js`的`state`,首先需要使用`useStore`函数从`vuex`中获取`store`对象,然后可以使用`computed`函数将`state`映射到组件的属性中。具体代码如下:
```javascript
<template>
<div>
<ul>
<li v-for="teacher in teacherList" :key="teacher.id">
{{ teacher.name }}
</li>
</ul>
</div>
</template>
<script>
import { useStore } from 'vuex'
import { computed } from 'vue'
export default {
setup() {
const store = useStore()
const teacherList = computed(() => {
return store.state.teacher.teacherList
})
return {
teacherList
}
}
}
</script>
```
在上面的代码中,我们首先使用`useStore`函数从`vuex`中获取`store`对象,然后使用`computed`函数将`store.state.teacher.teacherList`映射到组件的属性`teacherList`中。最后在模板中使用`v-for`指令循环渲染`teacherList`中的数据。
需要注意的是,我们在使用`computed`函数时,需要使用`store.state.teacher.teacherList`访问`teacher.js`模块中的`state`,其中`teacher`是模块的名称。
阅读全文