94 lines
3.0 KiB
JavaScript
94 lines
3.0 KiB
JavaScript
Component({
|
||
properties: {
|
||
// 题目对象
|
||
question: {
|
||
type: Object,
|
||
value: {}
|
||
},
|
||
// 题目索引
|
||
questionIndex: {
|
||
type: Number,
|
||
value: 0
|
||
},
|
||
// 用户答案数组（用于显示选中状态）
|
||
answers: {
|
||
type: Array,
|
||
value: []
|
||
},
|
||
// 选项标记数组
|
||
optionMarkers: {
|
||
type: Array,
|
||
value: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H']
|
||
},
|
||
// 是否显示答案解析
|
||
showAnalysis: {
|
||
type: Boolean,
|
||
value: false
|
||
},
|
||
// 是否显示答案图标（正确/错误标记）
|
||
showAnswerIcon: {
|
||
type: Boolean,
|
||
value: false
|
||
},
|
||
// 是否可点击选项
|
||
clickable: {
|
||
type: Boolean,
|
||
value: true
|
||
}
|
||
},
|
||
|
||
data: {
|
||
// 组件内部数据
|
||
},
|
||
|
||
attached() {
|
||
// 组件挂载时，检查数据
|
||
|
||
},
|
||
|
||
observers: {
|
||
// 监听 question 属性变化
|
||
'question': function(question) {
|
||
console.log('question-display 组件 question 属性变化:', question);
|
||
}
|
||
},
|
||
|
||
methods: {
|
||
// 选项点击事件
|
||
onOptionClick(e) {
|
||
if (!this.data.clickable) {
|
||
return;
|
||
}
|
||
const index = e.currentTarget.dataset.index;
|
||
this.triggerEvent('optionclick', {
|
||
optionIndex: index,
|
||
questionIndex: this.data.questionIndex
|
||
});
|
||
},
|
||
|
||
// 题目容器内触摸：catch 阻止冒泡到问题面板；横向滑动时通知页面切换题目（因 swiper 收不到被 catch 的触摸）
|
||
onQuestionTouchStart(e) {
|
||
if (e.touches && e.touches[0]) {
|
||
this._touchStartX = e.touches[0].clientX;
|
||
this._touchStartY = e.touches[0].clientY;
|
||
this._swipeHorizontalEmitted = false;
|
||
}
|
||
},
|
||
onQuestionTouchMove(e) {
|
||
if (this._swipeHorizontalEmitted || !e.touches || !e.touches[0]) return;
|
||
const dx = e.touches[0].clientX - this._touchStartX;
|
||
const dy = e.touches[0].clientY - this._touchStartY;
|
||
const threshold = 40;
|
||
if (Math.abs(dx) > threshold && Math.abs(dx) > Math.abs(dy)) {
|
||
this._swipeHorizontalEmitted = true;
|
||
this.triggerEvent('swipehorizontal', { direction: dx > 0 ? 'right' : 'left' });
|
||
}
|
||
},
|
||
onQuestionTouchEnd() {
|
||
this._swipeHorizontalEmitted = false;
|
||
},
|
||
},
|
||
|
||
});
|
||
|