uni使用vuex

首先引入vuex,只要你的uni开发软件没有问题不需要下载什么直接引入就好。
在这里插入图片描述
创建store目录----》index.js

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
    state: {
		obj:{
			unitPrice:'',
			productName:''
			// singleAmount:0,
			// count:0,
			// rate:0
		}
	},
    mutations: {
		comOrder(state,obj){
			state.obj = obj
		}
	}
})
export default store

state里是自定义的变量。mutations里的是方法

main.js里

import store from './store'   //引入vuex

Vue.prototype.$store = store    //把vuex定义成全局组件

存值的页面
定义一个方法取到要传的值。然后$store.commit放到vuex里存起来

methods: {
			choose(e){
				console.log(e);
				let obj = {
					unitPrice:e.price,
					productName:e.name,
					singleAmount:0,
					count:0,
					rate:0,
				};
				this.$store.commit('comOrder',obj)
				uni.navigateTo({
					url:'./newBussiness'
				})
			}
		}

取值页面
onload里直接打印就可以取到

onLoad(option) {
			console.log(vuex.state.obj)
		},

重点说一下。存值页面和取值页面别忘了引入vuex
import vuex from “@/store/index.js”;

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uni-app中,可以使用Vue的状态管理库Vuex来实现模块化使用。通过引入Vuex并配置相关的store,在不同的组件中可以轻松地获取和修改共享的状态数据。引用中提到了一些使用Vuex进行模块化的方式,比如使用...mapState、...mapMutations和...mapActions等工具函数来简化代码。这些函数可以帮助我们在组件中方便地映射状态、提交变更和分发行为。在uni-app中,你可以在全局统一的配置文件config.js中配置Vuex,并在需要使用的页面或组件中引入并使用它。这样可以实现在不同的页面和组件中共享和管理数据。如果需要自动生成组件和页面模板,你可以使用npm命令来实现。此外,还可以使用npm命令来更新uni-app编译器、uni-ui和uview等,以实现打包优化。 <span class="em">1</span><span class="em">2</span> #### 引用[.reference_title] - *1* [uni-app_base:uni-app uniapp项目初始化模板,集成常用功能和配置,持续完善中..](https://download.csdn.net/download/weixin_42116805/18637367)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* [uni-app(VUE)中使用模块化使用VUEX](https://blog.csdn.net/qq_40510461/article/details/118637217)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值