当前位置:网站首页>Pinia module division
Pinia module division
2022-07-06 23:52:00 【Liang Yunliang】
pinia The module division of is through js Divided by naming .
Example :
First step : Split store file
- store/index.ts
import {
createPinia } from "pinia"
const store = createPinia()
export default store
- store/user.ts
import {
defineStore} from "pinia"
export const useUserStore = defineStore({
//js name
id: "user",
state: () => {
return {
name: ' Zhang San ',
age: 18
}
}
})
- store/order.ts
import {
defineStore} from "pinia"
export const useOrderStore = defineStore({
//js name
id: "order",
state: () => {
return {
orderList: [{
id: 1001, total: 6666}, {
id: 1002, total: 8888}, {
id: 1003, total: 9999}]
}
}
})
The second step :vue
- User.vue
<template>
User:{
{ name }} == {
{ age }}
</template>
<script setup lang="ts"> import {
storeToRefs} from "pinia" import {
useUserStore} from "@/store/module/user" const userStore = useUserStore() const {
name, age} = storeToRefs(userStore) </script>
- Order.vue
<template>
order <br>
{
{order}}
</template>
<script setup lang='ts'> import {
storeToRefs} from "pinia" import {
useOrderStore} from "@/store/module/order" const orderStore = useOrderStore() const order = storeToRefs(orderStore) </script>
边栏推荐
- Who said that new consumer brands collapsed? Someone behind me won
- How to implement Lua entry of API gateway
- (LeetCode)两数之和
- 为什么完全背包要用顺序遍历?简要解释一下
- 使用yum来安装PostgreSQL13.3数据库
- CRMEB 商城系统如何助力营销?
- Unity color palette | color palette | stepless color change function
- 电脑重装系统u盘文件被隐藏要怎么找出来
- JDBC programming of MySQL database
- okcc呼叫中心的订单管理时怎么样的
猜你喜欢
leetcode:236. 二叉树的最近公共祖先
【2022全网最细】接口测试一般怎么测?接口测试的流程和步骤
2022 latest blind box mall complete open source operation source code / docking visa free payment interface / building tutorial
Basic chart interpretation of "Oriental selection" hot out of circle data
Master binary tree in one article
Eureka Client启动后就关闭 Unregistering application xxx with eureka with status DOWN
人均瑞数系列,瑞数 4 代 JS 逆向分析
Knowledge * review
自动化测试工具Katalon(Web)测试操作说明
Asset security issues or constraints on the development of the encryption industry, risk control + compliance has become the key to breaking the platform
随机推荐
DAY ONE
AVL树到底是什么?
人均瑞数系列,瑞数 4 代 JS 逆向分析
The largest single investment in the history of Dachen was IPO today
Who said that new consumer brands collapsed? Someone behind me won
[OFDM communication] OFDM system signal detection based on deep learning with matlab code
AI金榜题名时,MLPerf榜单的份量究竟有多重?
Yaduo Sangu IPO
Summary of three methods for MySQL to view table structure
浅谈现在的弊端与未来的发展
(leetcode) sum of two numbers
Wind chime card issuing network source code latest version - commercially available
Win11怎么恢复传统右键菜单?Win11右键改回传统模式的方法
Automatic test tool katalon (WEB) test operation instructions
【2022全网最细】接口测试一般怎么测?接口测试的流程和步骤
17、 MySQL - high availability + read / write separation + gtid + semi synchronous master-slave replication cluster
【无人机】多无人协同任务分配程序平台含Matlab代码
【通信】两层无线 Femtocell 网络上行链路中的最优功率分配附matlab代码
Server SMP, NUMA, MPP system learning notes.
JDBC programming of MySQL database