Here is a bug report when developing shopping cart-related functions, as shown in the figure.
The reason for searching is that the uni-app I developed is version vue3, but when using vuex, the format of version 2 is used.
1. First configure vuex
1. Create a
store folder
in the project root directory , specifically used to store
vuex- related modules
2.
Right-click on
the
store directory, select
New - > js file , and create a new store.js file .
3. Initialize the instance object of Store according to the following 4 steps in store.js
code before error
Modify the above code to the following
4. Import the store instance object in main.js and mount it on the Vue instance. Note that it must be added below the #ifdef VUE3 position.
5. Right-click on the store directory, select New - > js file , create the store module of the shopping cart, and name it
cart.js
6. In
cart.js
, initialize the following
vuex
module
7. In
the goods_detail.vue
page, modify
the code in the
<script></script> tag as follows:
8. When rendering the page, you can directly use the mapped data