1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162 |
- <template>
- <uni-popup ref="popupRef" :mask-background-color="popup_background_color">
- 答对: {{data.right}}题,
- 答错:{{data.wrong}}题
- 已成功获得 {{data.jifen}}积分
- <button @click="checkAnswer">查看试题</button>
- <button @click="goStudyContinue">继续学习</button>
- </uni-popup>
- </template>
- <script setup>
- import {
- ref,
- reactive
- } from "vue"
- const popupRef = ref(null)
- const popup_background_color = `rgba(0,0,0,0.2)`; // 【弹出框模态层背景颜色】
- const emits = defineEmits(['checkAnswer', 'goStudy']);
- const data = reactive({
- right: 0,
- wrong: 0,
- jifen: 0
- })
- // 切换成绩
- function showPopup({
- right,
- wrong,
- jifen
- }) {
- data.right = right;
- data.wrong = wrong;
- data.jifen = jifen;
- popupRef.value.open()
- }
- function closePopup() {
- popupRef.value.close()
- }
- // 查看答案
- function checkAnswer() {
- emits('checkAnswer');
- closePopup();
- }
- // 继续学习
- function goStudyContinue() {
- emits('goStudy');
- closePopup();
- }
- defineExpose({
- showPopup
- })
- </script>
- <style>
- </style>
|