uniapp小程序因使用 uni.switchTab传不了值使用vuex(简单明了)

这篇具有很好参考价值的文章主要介绍了uniapp小程序因使用 uni.switchTab传不了值使用vuex(简单明了)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

uniapp里面不需要npm下载vuex,自带vuex直接用就行

一、先建立一个index.js文件夹 

里面写如以下代码

import Vue from 'vue'

import Vuex from 'vuex'

Vue.use(Vuex)

const store = new Vuex.Store({
    state: {
		    userExt: null
	},
    mutations: {
		//相当于同步的操作
		 setUserExt(state, ext) {
		      state.userExt = exe;
		    }
	},
	  getters: {
	    getUserExt: state => state.userExt
	  },
    actions: {
		//相当于异步的操作,不能直接改变state的值,只能通过触发mutations的方法才能改变
	}
})
export default store

二、现在就是把你要储存的值放在vuex里面

	//引入vuex使用Mutations方法
import { mapMutations } from 'vuex';
    映射出来这个方法
	   ...mapMutations(['setUserExt']),
    //把需要的值传进去
	 this.setUserExt(res.Exe);

三、把传到vuex的值拿出来

import { mapState } from 'vuex';
老规矩引入映射就完了
	computed:{
			 ...mapState(['userExt']),
		},

文章来源地址https://www.toymoban.com/news/detail-831161.html

到了这里,关于uniapp小程序因使用 uni.switchTab传不了值使用vuex(简单明了)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uni-app小程序(vue3版本)使用Vuex在调用store时报错: Cannot read property ‘state‘ of undefined

    这里是开发购物车相关的功能时遇到bug报错,如图所示   通过搜索是因为我开发的uni-app是vue3版本,但是在使用vuex时使用的是2版本的格式所造成的错误 一、首先配置vuex 1. 在项目根目录中创建 store 文件夹,专门用来存放 vuex 相关的模块 2. 在 store 目录上鼠标右键,选择 新建

    2024年02月15日
    浏览(31)
  • uni-app uni.switchTab和uni.reLaunch跳转tabbar页面

    uni.switchTab: 跳转列表不会刷新 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。 uni.reLaunch: 跳转列表会刷新 关闭所有页面,打开到应用内的某个页面。( 可以跳转到tabBar 页面 ) 但如果是列表的自定义表头有多个title的时候需要加参数才能返回到对应的列表 如下图所示

    2024年02月11日
    浏览(37)
  • 关于uniapp微信小程序scroll-view组件使用show-scrollbar隐藏不了滚动条

    这里关于使用  scroll-view组件  时候有滚动条 想要隐藏滚动条但是使用show-scrollbar没有效果 这时候又使用类名隐藏滚动条 使用id隐藏滚动条都不行 解决方法:在使用  scroll-view组件 的页面或者app 页面加上以下代码就可以了         

    2024年02月12日
    浏览(30)
  • uniapp 使用 uni-data-picker级联选择器,自定义展示,uni小程序

    先看效果是不是你要的效果 页面组件 接口数据 接口数据以及处理方式 选中后的数据处理,拿到选中的值

    2024年02月05日
    浏览(36)
  • 【uniapp 中使用uni-popup阻止左滑退出程序】

    在uniapp中,可以使用uni-app插件uni-popup提供的阻止左滑退出程序的功能。具体步骤如下: 安装uni-popup插件:在HBuilderX编辑器中,打开manifest.json文件,找到“dependencies”字段,在其后添加: “uni-popup”: “^1.4.3” 保存并关闭文件后,HBuilderX会自动安装插件。 在APP.vue中引入uni

    2024年02月13日
    浏览(27)
  • Uniapp中vuex的使用

    vuex的学习笔记,很多地方还都不是很懂,先记下来再说,比小程序里自带的store复杂很多,看着头大,而且方法里面很多ES6的内容,头都看到爆炸 新建store.js,挂载到main.js 1、在根目录下创建 store 文件夹,用来存放 vuex 相关的模块 2、在 store 中新建 store.js 文件 3、在 sto

    2024年02月10日
    浏览(23)
  • uniapp 配置并使用 VueX

     Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 uni-app 内置了 VueX  1、创建需要的文件  右键点击 根目录【我的是 uni-shop】,然后新建 目录,命名为 store 右键点击

    2024年02月10日
    浏览(20)
  • uniapp小程序路由跳转,使用uni.navigateBack方法,实现跳转传参

    由于小程序跳转限制10层,为了尽可能的减少页面栈,在小程序中会用到uni.navigateBack()方法,使用中难免会遇到页面跳转之间传参的问题。uni.navigateBack和uni.navigateTo、uni.redirectTo方式不同,不能通过路由拼接的方式传参,以下是三种跳转的方法: 在小程序中uni.navigateTo和u

    2024年02月16日
    浏览(44)
  • uniapp小程序路由跳转,使用uni.navigateBack方法,实现页面返回上一页

    在小程序中uni.navigateTo和uni.redirectTo是通过路由拼接的方式传参 uni.navigateBack() 是一个用于在uni-app中进行页面后退操作的API。它可以让你返回到上一个页面。在给定的示例中,uni.navigateBack() 被调用并传入了一个对象作为参数。该对象具有一个属性 delta,用于指定要后退的页面

    2024年04月28日
    浏览(30)
  • uniapp 实现tabBar-switchTab之间的传参

    tabbar之间跳转页面时,需要传递一个参数。 官方文档明确说明: 跳转tabBar栏的页面只能使用 uni.switchTab 并且url 路径后面不能传递参数。 方法1:setStorageSync(本地缓存) //index.vue 页 //user.vue 页(在onShow中从本地缓存中获取出来,进行相关操作) 方法2:使用全局变量: main.js 定义

    2024年01月21日
    浏览(32)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包