vue中,写在methods里的B方法去调A方法的数据,访问不到?
今天在写项目的时候,发现了一个京城性忽略的问题,在vue的methods的方法里面定义了两个方法,如下:
getTaskList() {
api.growthDetails.taskList({
appChannel: this.$isH5 ? 2 : 1
}).then(res => {
if (res.data.obj) {
// 取数据
let resData = JSON.parse(res.data.obj) || {};
this.taskList = resData
// 获取列表内容
this.listData = resData.list && resData.list
// 需要传到详情页的字段
this.eventId = this.listData[0].eventId
this.taskCode = this.listData[0].taskCode
this.eventTypeId = this.listData[0].eventTypeId }
})
},
// 获取商品详情信息
getTaskDetail() {
console.log('***', this.eventId)
api.growthDetails.taskDetail({
eventId: this.eventId,
taskCode: this.taskCode,
memberId: this.memberId,
appChannel: this.$isH5 ? 2 : 1,
eventTypeId: this.eventTypeId
}).then(res => {
console.log(res)
if (res.body.obj) {
this.taskDetail = JSON.parse(res.body.obj) || {}
// 判断title的长度
this.taskName = this.taskDetail.taskName
// 转换时间
this.taskDetail.startTime = utils.dateFormat("yyyy-MM-dd", this.taskDetail.startTime)
this.taskDetail.endTime = utils.dateFormat("yyyy-MM-dd", this.taskDetail.endTime)
}
})
}
我是在登录之后,进行调用的~
isLogin() {
utils.isLogin(true).then(user => {
this.memberToken = user.member_token
this.memberId = user.member_id
// 获取商品列表信息
this.getTaskList()
this.getTaskDetail()
}) },
其中getTaskDetail的方法中传入的参数,用的是从getTaskList取出来的存放的,但是在控制台打印不出存放的变量~~~~~~
然后,就去问了一下我的师傅,哈哈,一语道破~~
【思路】:
在A方法里面,将所需要的字段进行存储,这些字段在data中已经定义过,在B方法中,需要用到这些变量,直接用this.变量名,原则上是可以了,但是,
有一个地方要考虑一下,就是A方法里存储的时间, 肯定调接口然后存储, 接口是异步的, 一定要等这个接口成功,值存储好了 B方法才可以执行,不要A方法没来得及存储,就执行B方法
【怎么解决呢】
等A方法结束之后,在调用B方法,这是才能保证B方法中调用A方法的变量才会有值,有点类似于promise的思想,至于如何解决,就更简单了~~~
把isLogin里面改为:
isLogin() {
utils.isLogin(true).then(user => {
this.memberToken = user.member_token
this.memberId = user.member_id
// 获取商品列表信息
this.getTaskList()
// 去掉获取商品详情的方法 }) },
将商品详情的方法放到getTaskList获取商品成功之后写~
getTaskList() {
api.growthDetails.taskList({
appChannel: this.$isH5 ? 2 : 1
}).then(res => {
if (res.data.obj) {
// 取数据
let resData = JSON.parse(res.data.obj) || {};
this.taskList = resData
// 获取列表内容
this.listData = resData.list && resData.list
// 需要传到详情页的字段
this.eventId = this.listData[0].eventId
this.taskCode = this.listData[0].taskCode
this.eventTypeId = this.listData[0].eventTypeId
// 调用详情页
this.getTaskDetail()
}
})
},
哈哈哈~~~~ 解决啦 小问题是最容易被忽略的~
vue中,写在methods里的B方法去调A方法的数据,访问不到?的更多相关文章
- 在vue中写一个跟着鼠标跑的div,div里面动态显示数据
1.div应该放在body里面,这是我放在body中的一个div里面的div <!-- 信息查看层 --> <div class="floatDiv" :styl ...
- Vue 中 computed ,watch,methods 的异同
methods,watch和computed都是以函数为基础的. computed 和 watch 都可以观察页面的相应式数据的变化.当处理页面的数据变化时,我们有时候很容易滥用watch, 而通常更 ...
- Vue中computed,methods 和watch
Vue中的计算属性和方法属性 1.计算属性 computed 模版中可以使用表达式 <div id="example"> {{ message.split('').re ...
- vue中computed与methods的异同
在vue.js中,有methods和computed两种方式来动态当作方法来用的 如下: 两种方式在这种情况下的结果是一样的 写法上的区别是computed计算属性的方式在用属性时不用加(),而met ...
- Vue中computed、methods、watch的联系和区别
computed是计算树形,methods是方法. new Vue({ el: '#example', data: { message: 'Hello' }, computed: { reversed ...
- Vue 中computed 与 methods 区别
1.示例 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF- ...
- Vue中 computed 和 methods的区别
涉及到计算部分的时候,计算属性是基于它们的依赖进行缓存的,如果说值不变,那么它就不会去重新执行,只有当值发生了改变,它才会去重新执行一次,其它时候它都是缓存的.而方法则会反复计算处理.二者之间的差距就 ...
- Vue中解决路由切换,页面不更新的实用方法
前言:vue-router的切换不同于传统的页面的切换.路由之间的切换,其实就是组件之间的切换,不是真正的页面切换.这也会导致一个问题,就是引用相同组件的时候,会导致该组件无法更新,也就是我们口中的页 ...
- vue中使用axios(异步请求)和mock.js 模拟虚假数据
一.使用axios 1.安装 npm install --save axios 2.引用 import Axios from 'axios' Vue.prototype.Axios = Axios 二 ...
随机推荐
- group by 和count的联合使用问题 [转]
group by 和count的联合使用问题 今天写查询语句遇到一个问题,就是用group by进行分组以后,用count统计分组以后的个数, 开始写的语句大体是: select count(m.fb ...
- 团队作业Week6:规格说明书编写
(1)请分析你们团队项目的典型用户和场景,并写一个团队博客发布你们团队项目的功能规格说明书. (2)再写一个博客团队博客发布你们项目的设计文档(技术规格说明书). 截止时间:2015-11-03
- 11.12 Daily Scrum(保存草稿后忘了发布·····)
在实现过程中,我们发现要将不同人开发的组件整合起来并不是一件容易的事,于是我们调整了一下任务,修改了一下各自的程序: Today's tasks Tomorrow's tasks 丁辛 餐厅列表 ...
- Linux内核分析(第二周)
操作系统是如何工作的? 一.总结:三大法宝 1.存储程序计算机 + 函数调用堆栈 + 中断机制 2.堆栈:C语言程序运行时候必须的一个记录调用路径和参数的空间(函数调用框架/提供局部变量/传递参数/保 ...
- Beta版本冲刺(六)
目录 组员情况 组员2:胡青元 组员3:庄卉 组员4:家灿 组员5:恺琳 组员6:翟丹丹 组员7:何家伟 组员8:政演 组员9:黄鸿杰 组员10:刘一好 组员11:何宇恒 展示组内最新成果 团队签入记 ...
- Java认识对象
一.类与对象 java中有基本类型和类类型两个类型系统.Java撰写程序几乎都在使用对象,要产生对象必须先定义类,类是对象的设计图,对象是类的实例 1.定义类 类定义使用的关键词为class,建立实例 ...
- Alpha 冲刺四
团队成员 051601135 岳冠宇 051604103 陈思孝 031602629 刘意晗 031602248 郑智文 031602234 王淇 会议照片 项目燃尽图 项目进展 实现后端聊天接收,搜 ...
- 获取所有选中框的ids值
var os = $("input[name='rec_ids[]']:checked"); var ids = []; os.each(function(i){ ids.push ...
- [转帖]Oracle 11G RAC For Windows 2008 R2部署手册
Oracle 11G RAC For Windows 2008 R2部署手册(亲测,成功实施多次) https://www.cnblogs.com/yhfssp/p/7821593.html 总体规划 ...
- [转帖]"微信支付"勒索病毒制造者被锁定 传播、危害和疫情终极解密 --- 可以学习下一年火绒团队的分析原理的精神.
"微信支付"勒索病毒制造者被锁定 传播.危害和疫情终极解密 https://www.cnbeta.com/articles/tech/794851.htm 12月1日,首个要求&q ...