onClickVolunteerItem(key) { const oldVolunteer = this.volunteerInfos[key] if (oldVolunteer.collegeData) { let _this = this uni.showModal({ content: key + "以选择 " + oldVolunteer.collegeData.name + " 是否替换为 " + this.collegeData.name, success(e) { if (e.confirm) { if (!_this.volunteer) { _this.volunteer = {} } // 设置新的志愿学校信息 _this.volunteer.collegeData = _this.collegeData delete _this.volunteer.collegeData.majorsInfo // 设置志愿表 _this.volunteerInfos[key] = _this.volunteer // 清除当前志愿表信息 _this.volunteerInfos[_this.volunteerKey] = {} // 设置当前选中志愿表key _this.volunteerKey = key // 归档 userManager.setVolunteerInfo(_this.volunteerInfos) } } }) } else if (this.volunteer.collegeData) { // 清除当前志愿表 this.volunteerInfos[this.volunteerKey] = {} // 设置新的志愿表 this.volunteerInfos[key] = this.volunteer // 设置当前选中志愿表key this.volunteerKey = key // 归档 userManager.setVolunteerInfo(this.volunteerInfos) } else { // 设置当前选中志愿表key this.volunteerKey = key // 设置新的志愿表 this.volunteer = this.volunteerInfos[key] } },分析这段代码,将替换改为跳转到对应的字母
时间: 2024-01-21 12:19:53 浏览: 54
解决vue.js this.$router.push无效的问题
5星 · 资源好评率100%
这段代码是一个 onClickVolunteerItem 方法,当用户点击志愿表的某个选项时会触发该方法。该方法首先获取用户之前选择的志愿表信息 oldVolunteer,然后判断该志愿表是否已经选择了学校(通过判断 oldVolunteer.collegeData 是否存在)。如果已经选择了学校,则会弹出一个确认框,询问用户是否要替换该学校为当前选中的学校信息(this.collegeData)。如果用户点击确认,则会将当前选中的学校信息设置为该志愿表的学校信息,并清除该学校信息中的 majorsInfo 字段,然后将该志愿表信息保存到 volunteerInfos 中,并清除当前选中志愿表的信息,最后将当前选中志愿表的 key 设置为 key,并将志愿表信息保存到 userManager 中。如果用户点击取消,则不进行任何操作。
如果 oldVolunteer.collegeData 不存在,则说明该志愿表还没有选择学校。此时会判断当前选中的志愿表中是否已经选择了学校(通过判断 this.volunteer.collegeData 是否存在)。如果已经选择了学校,则会将当前选中志愿表的信息保存到 volunteerInfos 中,并将当前选中志愿表的 key 设置为 key,并将志愿表信息保存到 userManager 中。如果当前选中志愿表中也没有选择学校,则直接将当前选中志愿表的 key 设置为 key,并将该志愿表信息保存到 this.volunteer 中。
如果要将替换改为跳转到对应的字母,可以按照以下步骤修改代码:
1. 将 uni.showModal 改为 uni.navigateTo,并将 content 参数改为 url 参数。
2. 在 url 参数中增加一个字母参数,用于指定需要跳转到哪个字母的位置。
3. 在跳转到指定页面的 onLoad 方法中,获取字母参数的值,并将页面滚动到对应字母的位置。
修改后的代码如下:
```
onClickVolunteerItem(key) {
const oldVolunteer = this.volunteerInfos[key];
if (oldVolunteer.collegeData) {
const url = '/pages/volunteer/volunteer?key=' + key + '&letter=' + this.collegeData.name.charAt(0);
uni.navigateTo({
url: url,
success: (res) => {
console.log('跳转成功');
},
fail: (err) => {
console.log('跳转失败', err);
}
});
} else if (this.volunteer.collegeData) {
this.volunteerInfos[this.volunteerKey] = {};
this.volunteerInfos[key] = this.volunteer;
this.volunteerKey = key;
userManager.setVolunteerInfo(this.volunteerInfos);
} else {
this.volunteerKey = key;
this.volunteer = this.volunteerInfos[key];
}
}
```
在跳转到指定页面的 onLoad 方法中,可以按照以下步骤实现滚动到指定字母的位置:
1. 在 onLoad 方法中获取 letter 参数的值。
2. 使用 uni.createSelectorQuery 获取页面中所有字母元素的位置信息。
3. 根据 letter 参数的值,找到对应的字母元素,并获取其位置信息。
4. 使用 uni.pageScrollTo 方法将页面滚动到该字母元素的位置。
修改后的代码如下:
```
onLoad(options) {
const letter = options.letter;
uni.createSelectorQuery().selectAll('.letter').boundingClientRect((rects) => {
for (let i = 0; i < rects.length; i++) {
const rect = rects[i];
if (rect.dataset.letter === letter) {
uni.pageScrollTo({
scrollTop: rect.top,
duration: 300
});
break;
}
}
}).exec();
}
```
阅读全文