当前位置: 首页 > article >正文

uniapp 使用 $emit和$on——$on中无法为data中的变量赋值

问题在于this的指向,
解决办法是使用变量保存$on,其次再为data中的值赋值

以下是具体代码:

1、html代码:

			<view class="form_picker" @click="selePositionFun()">
				<view class="">
					<input placeholder="请选择职位类别" :disabled="true" v-if="positionOne == ''" />
					<view class="" v-else>{{positionOne}}-{{positionTwo}}</view>
				</view>
			</view>

2、 js代码:

①传递对象:
A页面传递:(使用.$emit)

		submitFun() {
			let newarr = {
				one: this.leftList[this.tabindex].type,   //一级名称
				two: this.selectList[0]                   //二级名称
			}
			uni.$emit('positionOne', newarr)
			uni.navigateBack()
		},



B页面接收:(使用.$on)
	onShow() {
		//接收上个页面传递的职位类别
		const on = uni.$on('positionOne', function (data) {
		 console.log('打印data', Object.values(data))    // ["销售", "广告销售"]
			var list = Object.values(data)   //使用Object.values 将对象转换为数组
			this.positionOne = list[0]
			this.positionTwo = list[1]
		})
		//再次赋值
		this.positionOne = on.positionOne
		this.positionTwo = on.positionTwo
			
		console.log('打印111', this.positionOne)   //销售 
		console.log('打印222', this.positionTwo)   //广告销售
	},
②传递数组:
A页面传递:(使用.$emit)

		submitFun() {
			uni.$emit('selectList', this.selectList)   //传递选中的数组
			uni.navigateBack()
		},
	

B页面接收:(使用.$on)
	onShow() {
		//接收上个页面传递的职位类别
		const on = uni.$on('selectList', function(data) {
			// console.log('打印收到的类型',typeof(data))  //object
			this.positionTwo = data.toString() //转为字符串使用
		})
		this.positionTwo = on.positionTwo
		console.log('打印positionTwo', this.positionTwo)   //销售, 广告销售
	},

在这里插入图片描述

完成~


http://www.kler.cn/news/162889.html

相关文章:

  • 大华DSS S2-045 OGNL表达式注入漏洞复现
  • 【软件推荐】文本转语音,语音转wav,导入ue5
  • P1046 [NOIP2005 普及组] 陶陶摘苹果题解
  • Django 用户验证与权限管理
  • 【【FPGA 之 MicroBlaze定时器中断实验】】
  • 基于Java SSM框架实现汽车在线销售系统项目【项目源码+论文说明】计算机毕业设计
  • SpringBoot 项目将jar 部署在服务器引用外部 配置文件
  • 服务器数据恢复—ocfs2文件系统被格式化为其他文件系统如何恢复数据?
  • ElasticSearch之Delete index API
  • os.walk()遍历文件夹/文件
  • 内蒙古自治区搭建平台、资源对接,促进民营经济发展壮大
  • 嵌入版python作为便携计算器(安装及配置ipython)
  • python 使用 AppiumService 类启动appium server
  • Android Camera2使用
  • 【Linux】more命令使用
  • MySQL:1118 - Row size too large(行大小不能超过 65535 问题)
  • docker安装node及使用
  • 消息队列的基本概念以及作用
  • 06、pytest将多个测试放在一个类中
  • 用23种设计模式打造一个cocos creator的游戏框架----(三)外观模式模式
  • 2024黑龙江省职业院校技能大赛信息安全管理与评估赛项规程
  • Pipenv环境配置+Pytest运行
  • Vue JAVA开发常用模板
  • spring 的概述和入门
  • Vue脚手架 生命周期 组件化开发
  • 【Pyqt】QObject::connect: Cannot queue arguments of type ‘QTextCursor‘
  • Windows故障排除 – 连接WiFi却无法上网
  • vue router之route和router的区别
  • 模电笔记。。。。
  • 智慧能源:数字孪生压缩空气储能管控平台