暂存

package.json

@@ -14,6 +14,7 @@
     "vuex": "^4.0.2"
   },
   "devDependencies": {
+    "@types/node": "^17.0.24",
     "@vitejs/plugin-vue": "^2.3.0",
     "typescript": "^4.5.4",
     "vite": "^2.9.0",

src/page/home/index.vue

@@ -3,7 +3,7 @@
  * @Author: uray(1109489444@qq.com)
  * @date: 2022-04-13 18:00:09
  * @lastEditors: uray(1109489444@qq.com)
- * @lastEditTime: 2022-04-14 15:18:08
+ * @lastEditTime: 2022-04-14 15:37:27
  * @FilePath: \toy_box_website\src\page\home\index.vue
 -->
 
@@ -15,6 +15,7 @@
 
 <script lang="ts">
 import { defineComponent } from "@vue/runtime-core";
+import store, { IGoods } from "../../store";
 import HeadVue from "./Head.vue";
 import TabsVue from "./Tabs.vue";
 
@@ -24,6 +25,17 @@ export default defineComponent({
         HeadVue,
         TabsVue,
     },
+
+    mounted() {
+        const goods = [
+            {
+                name: "【元气福袋】超值盲盒大礼包+随机礼品（价值175~288）",
+                price: 99,
+                // imgSrc: require("/src/assets/1.png"),
+            },
+        ] as IGoods[];
+        store.commit("setGoods");
+    },
 });
 </script>
 

src/store/index.ts

@@ -3,24 +3,34 @@
  * @Author: uray(1109489444@qq.com)
  * @date: 2022-04-13 17:03:49
  * @lastEditors: uray(1109489444@qq.com)
- * @lastEditTime: 2022-04-13 17:08:36
+ * @lastEditTime: 2022-04-14 15:31:03
  * @FilePath: \toy_box_website\src\store\index.ts
  */
 import { createStore } from "vuex";
 
+export interface IGoods {
+    name: string;
+    price: number;
+    imgSrc: string;
+}
 interface IState {
-    appName: string;
+    allGoods: IGoods[];
 }
 // 创建一个新的 store 实例
 const store = createStore({
     state() {
         return {
-            appName: "欧气潮玩",
+            allGoods: [],
         };
     },
     mutations: {
-        reName(state: IState, newName: string) {
-            state.appName = newName;
+        /**
+         * 设置新的数据源
+         * @param state
+         * @param newGoods
+         */
+        setGoods(state: IState, newGoods) {
+            state.allGoods = newGoods;
         },
     },
 });